为什么history.pushState（）破坏了我的导航功能？

Question

我正在使用history.pushState()来显示指示当前显示的动态内容（文章）的URL。

如果我在查看了一些动态内容后返回首页（index.html），然后尝试访问除index.html以外的其他页面，则导航链接已损坏。

在每当一个新的物品被选择我呼叫mysite.com/articles history.pushState(null, null, '/articles/' + <articleID>);。如我所料，这可以正常工作。显示的URL变为mysite.com/articles/articleID。

当前行为：

这时，如果我单击导航链接返回到index.html，则页面成功更改为index.html，但显示的URL变为mysite.com/articles/index.html

预期行为

显示的网址应为mysite.com或mysite.com/index。

所以我的问题是

1. 我使用history.pushState();或
的方式
2. 导航链接的配置方式？

Answer 1

您的通用重定向方法将所有内容重定向到/articles/<articleID>，包括指向首页的链接（如您提到的...articles/index.html）。

虽然您的应用出于某种原因可以将articles/index.html解析为首页（我不确定为什么）。从现在开始，所有相对链接（不以/开头）将相对于当前路径-/articles/index.html。

为了解决此问题，您应该从通用重定向机制中排除首页链接，然后重定向到/。