如何正確使用pushState，replaceState和popState？

Question

我正在嘗試使用歷史記錄API，但無法按預期工作。我看了幾個例子，但他們似乎都做錯了什麼。也就是說，預計流量不起作用：

1. 在新的頁面調用pushState的
2. 在popState負載所需的頁面

什麼我發現的情況是，對＃2網址未修改爲舊狀態（在Firefox中測試）。除非我再次調用pushState或replaceState，否則URL保持原來的位置。我也發現第一頁以某種方式在瀏覽器的歷史記錄中重複出現（按住回退我可以看到它）。

究竟應該如何使用歷史記錄以便Back/Forward/Reload像傳統頁面流一樣工作？

Answer 1

我遇到的問題涉及在頁面中使用iframe。每個框架位置的改變都會創建一個新的歷史記錄條目，其中包含所需歷史記錄的消息。爲了防止這一點必須替換iframe位置，而不是分配一個新位置。

document.getElementById('content_frame').contentWindow.location.replace(new_path) 

Location.replace不創建歷史記錄條目。