history.replaceState不适用于firefox v56 +

问题描述 投票:3回答:1

在我的应用程序中,要隐藏URL中的一些信息,我使用下面的代码。

history.replaceState ({}, "", "bar.html");

除了firefox最新版本(v56 +)之外,它在所有浏览器中都有效

在Firefox中,如果我按下F5,那么它将返回到我已用上述代码替换的上一个URL。

任何帮助将受到高度赞赏。

javascript firefox browser-history html5-history
1个回答
4
投票

有一个open issue on Bugzilla

Video Example 1Video Example 2解释了如何重现这个bug。

条件:

  1. Mozilla Firefox版本只有56+
  2. 单页应用程序
  3. 对于路由使用history.replaceState,所有参数都不为空

脚步:

  1. 登录并重定向到主页库qazxsw poi
  2. 在任何应用程序选项卡上导航并替换URL参数
  3. URLF5或点击cmd + r按钮
  4. Ups!..再次使用基础Refresh打开主页(但在其他浏览器中,我们看到选中的选项卡和正确的URL)

从URL中删除查询字符串时会出现相同的行为。

它可能是由以下行为引起的(我引用URL

主要问题是,在使用Vadim Goncharov然后点击history.replaceState后,我们将看到浏览器将更换的(正确的)cmd+r/f5发送到服务器,但在url和浏览器url栏中显示不正确的URL。并且此行为将继续(如果单击“cmd + r / f5”),直到我们在浏览器URL栏上单击“输入”。

第一个解决方法发布于location.search

在致电Felix Lee之前,请做history.replaceState

location.hash = location.hash;设置为自身没有任何效果,但会使bug消失。

这种解决方法并不理想,hash增加了第二种解决方法

浏览器请求的URL不同于位置栏中显示的URL ....

此外,解决方法并不理想,因为如果mtomalley还没有URLhash会添加一个,调用location.hash = location.hash,并添加历史记录条目。

另一种解决方法不那么简单:

  1. 使用您的后端技术可用的任何方法在客户端上公开请求popstate
  2. 在页面加载(在任何客户端路由代码之前),检查URIURI
  3. 如果它们不同,请使用window.location来修复它。

该位置将在任何重新加载时简要显示错误的URL,但至少它将被修复并且路由可以按预期工作...

replaceState提出的第三种解决方法

Mathis Wiehl

这样,在刷新和标签关闭的情况下,js位置的状态被刷新到FF位置(顺便说一下,当重新打开例如⌘+⇧+ t时,它具有相同的问题)。

来自Mathis的上述解决方法有以下问题(我引用window.addEventListener('unload', function(event) { location.replace(location) });

Next.js尝试使用Mathis上面提到的解决方法,它给他们带来了一些不好的问题。详细信息:jimmyhmiller

上面的解决方法遇到了一个新的错误,在https://github.com/zeit/next.js/pull/6896问题中有解释

登陆包含查询参数的页面时,浏览器将“锁定”到该页面,并以编程方式或手动导航到不同的同域页面,重定向回原始页面。请注意,在URL中包含查询参数之前,这不会开始发生,这完全是奇怪的

我还列出了#6882列表。

我随时可以对此帖进行进一步分析,研究和改进,我很高兴收到您的反馈。

© www.soinside.com 2019 - 2024. All rights reserved.