【问题标题】:How to change URL in browser without navigating away from page?如何在不离开页面的情况下更改浏览器中的 URL?
【发布时间】:2012-01-23 12:59:15
【问题描述】:

我目前正在编写一个复杂的 AJAX 应用程序,并且整个站点都有干净的 URL。目前 PHP 为每个页面创建基本布局,但是我不想在用户单击链接时离开每个页面,并且我不想在 URL 中有哈希,因为它不会t 适合网站的其余部分。我知道这之前在网站上已经出现过负载,而且似乎很常见,但我想知道是否有一种简洁的 HTML5 方式来更改地址栏中的 URL,即使它在技术上保持不变页面。

【问题讨论】:

    标签: javascript jquery ajax html


    【解决方案1】:

    您可以使用history.pushState 进行操作,但只能在支持它的浏览器中进行。只需在您的浏览器 JavaScript-Console 中尝试以下行。

    history.pushState({},"URL Rewrite Example","https://stackoverflow.com/example")
    

    更多信息请关注The pushState() method (Mozilla Developer)

    类似问题How do I, with JavaScript, change the URL in the browser without loading the new page?

    【讨论】:

    • 确保遵循Same Origin Policy 否则您将面临SecurityError: The operation is insecure。我的意思是,如果您的域是 example.com,则您只能将 history.pushState 用于 http://example.com/Someotherpage 之类的东西,而不允许使用 example.org 来防止网络钓鱼。如果没有这样的限制,每个人都可以创建一个类似于 google.com 的假页面,并且在加载后,他可以将 URL 设置为google.comMore
    【解决方案2】:

    正如其他人所说,HTML5 的 history.pushstate 是要走的路。尝试在 github 上浏览一个 repo 以查看它的实际效果 (https://github.com/visionmedia/express)。

    Trouble是IE唯一支持history的版本。pushstate是IE10,有点烂。

    很多网站都使用 hashbang #! URL,例如 Twitter(例如 https://twitter.com/#!/Sironfoot )。 hashbang 是搜索引擎同意的一种 URL 模式,因此他们仍然可以拖网和索引一个大量使用 Ajax 的网站(更多信息在这里http://code.google.com/web/ajaxcrawling/docs/specification.html),所以你可以走这条路。

    唯一的其他方法是对支持它的浏览器使用 history.pushstate,而对不支持的浏览器使用全页刷新。

    【讨论】:

    猜你喜欢
    • 2011-05-04
    • 1970-01-01
    • 2021-01-13
    • 2014-01-23
    • 2015-11-15
    • 1970-01-01
    • 2012-06-02
    • 2011-10-27
    相关资源
    最近更新 更多