Chrome 和 Firefox 的区别：重新加载运行 Javascript 游戏的页面

Posted 2023-02-22

【中文标题】Chrome 和 Firefox 的区别：重新加载运行 Javascript 游戏的页面

【英文标题】：Differences between Chrome and Firefox: Reloading a page running a Javascript game

【发布时间】：2011-11-03 21:04:52

【问题描述】：

我一般是 javascript 和网络编程的新手，所以这可能是一个愚蠢的错误。不过，我在查找有关它的信息时遇到了问题。

我正在用 Javascript 开发一款游戏，玩家可以通过点击并让他们的头像走到不同的建筑物/对象来四处走动并从一个场景移动到另一个场景。目前，如果检测到冲突，我只需调用 this.gotoTimer = setTimeout(self.location = this.targetURL, 1000); 即可获得页面更改位置。

页面链接在两个浏览器中都很好。问题是当用户按下后退按钮时......在 Chrome 中，一切都会重置；播放器生成在与我在代码中设置的相同区域，并且所有“链接目标”仍然有效。这是期望的行为。

在 Firefox 中，一旦按下后退按钮并重新加载页面，玩家就会处于他/她的最后一个已知位置，他们访问的链接目标将不再链接...我最终可以通过访问它们来停用所有这些并按下返回按钮。

根据我的研究，Firefox 处理缓存的方式似乎是一个问题，我能够找到的解决方法涉及在 Javascript 文件中附加一个随机数或时间。这让我觉得恶心。我也可能离题了。

所以我想知道两件事：

这是对问题的准确假设，还是存在其他问题？ 如果是，附加这些数字的最佳方法是什么。整个概念对我来说似乎很老套...

【问题讨论】：

另外：我知道（或至少认为）在内部将其实现为某种状态机会更好，但我需要尽快让概念验证工作。 （现在用于开发状态机的时间将更好地用于修复 IE 和其他浏览器问题。）

您最好在一个页面中实现您的游戏，而无需处理更改 URL 和后退按钮。如果您想提供后退按钮功能（游戏有问题），请查看History API。

你必须更清楚你所说的“链接目标”是什么意思，这里没有足够的信息来知道为什么你不能再次访问它们——它们是什么？

【参考方案1】：

很抱歉放弃了这么久的问题，但我找到了一个有效的解决方案！

我现在打电话 window.location.reload(true); 在我打电话之前 window.location = 不管Url；

...我不确定为什么它工作得这么好（我认为 window.location.reload 会在转到新页面之前重新加载当前页面[这显然不是我想要的]），但它看起来不错。我猜它可能在背后做一些我不知道的事情，但从功能上讲，它正在做我想做的事情。

【参考方案2】：

我认为https://developer.mozilla.org/En/Using_Firefox_1.5_caching 会回答你所有的问题。 Firefox 在返回时实际上并没有重新加载页面，而是将其连同其 JavaScript 状态一起恢复。所以你有几个选择：

添加 unload 事件处理程序以禁用此行为（次优，降低性能）。 使用window.location.replace() 而不是分配给window.location，这将阻止用户返回（我猜这是不受欢迎的）。 添加 pageshow 事件处理程序以重置 JavaScript 状态。 更改逻辑，使其不再假定用户会在点击链接后离开并且永远不会返回。