Javascript HTML5历史推送状态链接返回

在今天早些时候看到HTML5历史API上的另一篇文章并阅读了上的教程之后，我已经能够实现一个基本的工作演示，使用该API允许URL“重写”，而无需重新加载页面，也无需使用散列

我的问题是: 假设您有一个用户来到一个页面，单击其中一个使用历史API编写新URL的链接。然后用户将页面添加到书签中。现在我假设它现在会将重写的URL标记为书签。所以，当用户在几天后回来，并试图去书签页面，它不会返回404吗？那么，你如何实现一种方法，让它以某种方式得到解决呢

---

这是假设我重写的URL指向一个不存在的位置。

这应该由服务器端脚本完成。服务器应该解析URL并创建页面。

我今天刚刚遇到了这个问题，并在我的网站上写了一条关于这个问题的条目：当使用HTML5 pushstate时，如果用户复制或标记了一个深度链接并再次访问它，那么这将是一个直接的服务器命中，将是404

即使是js pushstate库也帮不了你，因为这是在页面和任何js加载之前请求的直接服务器调用

最简单的解决方案是向Nginx或Apache服务器添加重写规则，以便在内部重写对同一index.html页面的所有调用。浏览器认为它被提供了一个唯一的页面，而实际上它是同一个页面：

Apache（如果正在使用vhost，则在vhost中）：

---

当然，您仍然需要添加一些JS逻辑来显示正确的内容。在我的例子中，我使用的主干路由很容易处理这个问题。

我知道这很旧，但你完全滥用了pushstate。假设您有一个可以查看艺术家的页面，让我们称之为artists.php。如果他们点击一个，他们可以看到艺术家的个人简历。所以您有了“另一个”页面，artists.php？artist=journey

现在，假设您决定在一个模式窗口中异步加载bio，那么添加一个ajax触发器来禁用布局并只获取内容（artists.php？artist=travely&ajax=true）。您可以“推送”artists.php？artist=journey到历史记录，这样，如果加载了该页面，它将在模式窗口中加载带有预装旅程的artists页面

---

通过这种方式，你可以使用它为你的页面的不同状态添加书签，而不仅仅是当他们点击某个地方时有漂亮的URL

为什么要将不存在的url推送到浏览器的历史记录中？即使是您链接到的页面也会提示：在调用

pushState（）

后，浏览器不会尝试加载此URL，但稍后可能会尝试加载此URL，例如，在用户重新启动浏览器后，或者如您所指出的，如果用户将URL添加到书签中，则可能会尝试加载此URL。出于同样的原因，使用哈希位置哈希（通常）来捕获状态，而URL（作为其名称）用于标识资源。那么，为什么要将一个不存在的url推送到浏览器的历史记录中呢？

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteRule ^index\.html$ - [L]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.html [L]
 </IfModule>

rewrite ^(.+)$ /index.html last;