Javascript 如果URI没有改变，例如在单页应用程序上，如何检测用户是否在新页面上？

我需要能够检测用户何时访问了同一网站内的新页面。例如，他转到索引页，然后导航到联系人页

我需要使用JS进行检测

如果每个页面都有一个单独的URI，那么一切都很好，但是我发现很多网站，特别是SPA，在用户浏览时不会更改URI。所以一切都是

/

---

我的问题是：是否有其他方法可以检测用户何时导航到其他页面？例如，是否有一些窗口或文档值会告诉我这是一个唯一的页面？

取决于浏览器兼容性要求，您可以使用这些值来模拟和跟踪页面导航，而无需进行完整的页面加载

历史API示例 来自Mozilla MDN：

history.replaceState(stateObj, "page 3", "bar2.html");

这将导致URL栏显示， 但不会导致浏览器加载bar2.html，甚至不会检查它 存在bar2.html

通过使用

replaceState

及其同级函数

pushState

模拟导航，您可以使用

窗口.onpopstate

事件检测导航

window.onpopstate的示例，同样是：

传统替代方案：使用location.hash（#）

---

对于传统浏览器，一些SPA（如谷歌地图）使用

window.location.hash

和

window.onhashchange

事件实现（d）类似行为。这些通常采用“hashbang”片段标识符的形式，例如

#/some/page.html

，一种流行的格式，但由于没有将其用作路由机制而存在。现在我们对历史API进行了改进，这一点尤其正确。

您可以发布一些您正在监视的url吗？角度/spa页面包含#作为页面分隔符；其他人可能会做一些其他的欺骗来隐藏URL。对不起，我不能共享页面（NDA）。当前正在从

window.location.pathname

获取URI，并且它始终显示

/

。这也准确地反映了浏览器显示的内容。URL是否在查询字符串中包含#？不，它们没有；（你能使用新的资源计时API吗？

window.onpopstate = function(event) {
  alert("location: " + document.location + ", state: " + JSON.stringify(event.state));
};

history.pushState({page: 1}, "title 1", "?page=1");
history.pushState({page: 2}, "title 2", "?page=2");
history.replaceState({page: 3}, "title 3", "?page=3");
history.back(); // alerts "location: http://example.com/example.html?page=1, state: {"page":1}"
history.back(); // alerts "location: http://example.com/example.html, state: null
history.go(2);  // alerts "location: http://example.com/example.html?page=3, state: {"page":3}