如何使用JS History API pushState处理刷新页面

|| 我创建的一个小型网站（更像是摆弄）使用AJAX加载每个页面。以前，我正在更改url的哈希值，虽然效果很好，但是很丑陋，用户可以刷新页面，并且该页面将保留在同一页面上。现在，我已切换到在JS History API中使用pushState，它看起来要好得多，并且可以进行向前和向后的工作，但刷新却没有。例如：转到：http://example.com/page2进入404，因为没有称为页面2的实际页面。但是，如果我单击使用pushState方法更改url的按钮，它将按预期工作。如何允许刷新以及与新的History API的永久链接？（以及搜索引擎如何处理这一问题，因为Google必须通过将开发人员切换到#!来创建索引哈希URL的方式，将来他们是否有可能对历史api做类似的事情？）

已邀请:

3 个回复

辰炔诚薯

您完全不应使用ѭ2来推送无效的URL。它旨在用于该网站可以使用AJAX或不使用AJAX的情况下使用-即，您推送URL时，使用AJAX创建此输出时，如果没有AJAX，将导致相同的输出。如果只需要虚拟URL（例如在pre-pushState时代），请继续使用hash标签。

响摔衅幸

这是一个有点老的问题，但这是google排名最高的结果之一。为了寻求帮助，这是我的解决方案。您可以使用Apache的Mod_Rewrite将URL重写到中央位置。例如： example.com/p2从example.com/index.php?page=p2获取其页面内容您可以保留History API和AJAX的当前实现以获取内容，并将以下内容包括在.htaccess中

<ifModule mod_rewrite.c>
  RewriteEngine On
  RewriteRule ^([^/\\.]+)/?$ index.php?page=$1&full=1 [L]
</ifModule>

在您的index.php中：

<?php
  if(isset($_GET[\'full\']) {
    //Generate the full page here
  }else{
    //Generate just the content for AJAX
  }
?>

此页面是使用mod_rewrite重定向整个网站的很好的入门。（注释11和13也有有用的补充）

晤默报

我不得不将404错误重定向到网站首页（加载AJAX请求的网站），然后获取URL的最后一个部分，并运行使用AJAX请求加载页面的javascript函数。这不是一个很好的解决方案，但似乎效果很好。

要回复问题请先登录或注册

如何使用JS History API pushState处理刷新页面

3 个回复

发起人

javascript

html5

history

pushstate

问题状态

如何使用JS History API pushState处理刷新页面

与内容相关的链接

3 个回复

发起人

javascript

html5

history

pushstate

问题状态