如何更改網址而不更改瀏覽器歷史記錄

Question

到現在為止，我只知道如果我想在不重新加載整個頁面的情況下更改URL，我必須使用HTML瀏覽器歷史記錄 API。

我在我的網站上使用這個概念。 我們舉個例子吧。 假設用戶在此頁面上

 https://www.example.com/aboutus

然后他進入我們有過濾器的產品列表。 點擊任何過濾器系統會生成類似這樣的新網址

https://www.example.com/products?brands[]=song&brands[]=samsung&condition[]=new

在內部，它只是在呼喚

history.pushState({}, 'Title', link.href);

但是，它有一個問題。 單擊back按鈕將轉到上一個過濾器。 我不想要這個功能 。 我想，點擊瀏覽器后退按鈕，它應該到current頁面之前的頁面。 在我們的例子中，它應該采取

https://www.example.com/aboutus

謝謝。

Answer 1

你正在尋找replaceState() ，它取代了歷史中的當前位置而不是推新的位置，比如pushState()

來自MDN

history.replaceState()運行方式與history.pushState()完全相同，只是replaceState()修改當前歷史記錄條目而不是創建新條目。

當您想要更新當前歷史記錄條目的狀態對象或URL以響應某些用戶操作時， replaceState()特別有用。

請記住， 某些功能在舊版瀏覽器中不可用 。 但是有一個圖書館可以幫助你。