此网页如何更改地址栏中的 URL 查询参数？

Question

初始URL是

https://robertbarakett.com/products/the-barakett-t-hoodie?option1=Blue+night&option2=S

我跟踪了 HTTP 请求。它只做 1 次重定向：来自

https://robertbarakett.com/products/the-barakett-t-hoodie?option1=Blue+night&option2=S

至

https://robertbarakett.com/products/the-barakett-hoodie-black?option1=Blue%20night&option2=S.

但是地址栏最后的URL是

https://robertbarakett.com/products/the-barakett-hoodie-black?variant=31966791729263.

我读到有关在不重新加载页面的情况下更改 URL 的信息：

How do I modify the URL without reloading the page?

由于加载网页后没有导航历史，排除window.history.pushState。也许它使用 window.history.replaceState？我在页面的源代码中进行了搜索，没有找到 replaceState 的任何用途。那么如何验证它是使用replaceState还是其他技术呢？

Answer 1

正在使用window.history.replaceState

在：https://cdn.shopify.com/s/files/1/0061/4134/5903/t/13/assets/theme.js?v=13437044988013674143

它有：

_updateHistoryState: function(variant) {
   if (!history.replaceState || !variant) {
     return;
   }
  
   var newurl = window.location.protocol + '//' + window.location.host + window.location.pathname + '?variant=' + variant.id;
   window.history.replaceState({path: newurl}, '', newurl);
},

是源中唯一分配?variant

的地方

通过下载站点找到（右键单击另存为），然后搜索 ?variant

此网页如何更改地址栏中的 URL 查询参数？

How does this web page change URL query parameter in the address bar?

html

javascript

url

address-bar