Question

转到http://www.facebook.com/facebook?v=wall，然后点击信息标签。将加载内容，地址栏现在变为http://www.facebook.com/facebook?v=info，但网页未重新加载。

起初我认为它是Ajax，但我的问题是，如何在不重新加载的情况下更改地址栏？我知道我可以使用JS更改锚点（#wall）但是querystring（？v = wall），怎么样？

Answer 1

它使用HTML5的新history.pushState()功能，允许页面伪装成与最初提取的URL不同的URL。

目前WebKit似乎只支持这一点，这就是我们其他人看到?v=wall#!/facebook?v=info而不是?v=info的原因。

该功能允许动态加载的页面在支持JS和支持JS的用户代理之间正确加入书签，交换等。因为如果您作为JS用户将某人链接到?v=wall#!/facebook?v=info并且他们的浏览器不支持JS和XMLHttpRequest，则该页面将不适用于他们。 #!也用作搜索引擎下载非AJAX版本的提示。

Answer 2

@Snoob - 如果你接受了@bobince's answer，我会很感激，他在这里首先谈论具体细节。由于我不能删除/删除它，直到它被接受为止，我会将其更新为尽可能正确。

目前这是一个 WebKit （Chrome，Safari等）特定的东西，你看到（或者更确切地说，没有看到），就像@ {{3在其他浏览器中指出，您可以在栏中看到真实的网址：

http://www.facebook.com/facebook?v=wall#!/facebook?v=info\

Chrome只显示：

http://www.facebook.com/facebook?v=info

这有点道理，bobince，因此他们的浏览器也会识别内容的来源。

对细节的更正： Webkit浏览器在这种情况下使用HTML 5历史记录功能given this is how you make AJAX Content crawlable with the Google search engine（请查看HistoryManager）显示Facebook想要缩短的URL具体来说，他们正在使用you can see the code here来替换您使用的直接网址。

注意： 此答案可能以后无效（WebKit特定位），因为其他浏览器支持HTML5功能越来越多，这可能会很快过时的

Answer 3

对于MooTools开发人员，我建议查看cpojer的mootools-history插件，该插件在可用时提供对本机历史记录API的支持，并回退到哈希值。

Answer 4

我没有Facebook所以我无法检查。但我95％肯定它必须是一个完整的页面请求，位置栏是不可写的，因为这对于网络钓鱼网站来说是一个非常有用的功能（而不是http://fakeonlinebank.com它重写为{{3} }）。可能只是这么快，你的浏览器似乎只加载那部分？

但是我很想知道是否有人会纠正我，因为这意味着他们有你想听的答案;）

facebook如何在浏览器地址栏中重写页面的源URL？

4 个答案: