强制（或很好地询问）刷新浏览器答案

【问题标题】：Force (or ask nicely) to refresh the browser强制（或很好地询问）刷新浏览器
【发布时间】：2013-04-15 18:41:14
【问题描述】：

所以我运行了一个使用大量 javascript 和 ajax 的网站。我了解如何让用户刷新他们的浏览器when the browser loads。但是，如果我需要他们在加载网站后刷新浏览器会怎样？

我想更改提供给客户端的 ajax 以加快速度，但这会导致尚未刷新浏览器的用户出错。

我能想出的唯一解决方案是，当需要新版本的 JavaScript 文件时，网站会使用弹出窗口要求用户强制刷新浏览器。（这不会真正修复当前版本，但可以防止未来出现问题。）

我讨厌将弹出窗口用于我可以自动执行的操作。有没有更好的方法来强制客户端更新？

【问题讨论】：

不知道你在做什么。 Ajax 的全部目的是在不刷新页面的情况下将内容加载到 dom 中。如果您确实想刷新页面，为什么不直接发出 http get 或 post 请求，而不使用 ajax？
您提供的链接提供了几种在需要时破坏缓存的方法。使用其中之一而不是刷新页面。您似乎担心资源的新“版本”，可以通过刷新页面来检索。更改 URL 是诱使浏览器处理它或正确配置服务器的正确方法
@ryan 也许我的措辞很糟糕。用户正在向服务器发出大量 ajax 请求。但是如果服务器的行为发生变化，每个向服务器发出请求的人都会突然出现一个损坏的页面，并且没有说明页面损坏的原因。如果他们刷新浏览器，该站点将被修复，但用户不知道这一点。我想知道如果服务器和客户端不同步，是否有刷新页面的好方法。
@ryan 想象一个以“hh:mm”格式返回时间的服务器端脚本。客户端 Ajax 每分钟从服务器获取该时间，对其进行解析，然后以某种方式保存。稍后，我更新了我的服务器端脚本以返回一个 UNIX 时间戳，并且我相应地更新了我的客户端脚本以期望一个 UNIX 时间戳。但是，任何仍在运行的旧客户端脚本预计会出现“hh:mm”时间，并且会在服务器发送 UNIX 时间戳时中断。 OP 希望通过强制客户端刷新并获取新的客户端脚本来消除旧的客户端脚本。

【解决方案1】：

window.location.href = "http://example.com"

用http://example.com指向的页面替换当前页面。

【讨论】：

设置.href 不会替换页面。它导航到新页面。调用 window.location.replace 将替换页面。
根据location MDN page，replace 和assign 的区别（与直接设置href 相同）是replace 不会在用户的后退/前进列表。
没错。我只是在挑剔你的措辞，但希望你能理解其中的区别。只是取决于需要哪种方法

【解决方案2】：

听起来您的 JavaScript 无法获取通过 Ajax 方法加载的数据的更新版本，对吗？例如，如果两个 Ajax 调用尝试加载“data.txt”，那么第二个调用仅使用缓存版本。

您也可能在加载脚本本身的新版本时遇到问题。

解决这两个问题的方法是向脚本源和 Ajax 源添加随机生成的查询字符串。

例如，制作一个加载主脚本的脚本，如下所示：

/* loader1.js */
document.write('<script src="mainjavascript.js?.rand=', Math.random(), '"></script>');

在你的 HTML 中，就这样做

<script src="loader1.js"></script>

同样的方法也适用于 JavaScript Ajax 请求。假设“client”是一个新的 XMLHttpRequest() 对象，并且已经正确设置了 readystatechange 函数等，那么您只需附加相同的查询字符串，如下所示：

request = client.open('GET', 'data.txt?.rand=' + Math.random(), true);
request.send();

您可能正在使用一个库来执行您的 Ajax 请求，因此它更加容易。只需将数据 URL 指定为 'data.txt?.rand=' + Math.random() 而不仅仅是 'data.txt'

【讨论】：

我认为 OP 的问题在于他的服务器端 API 正在发生变化。例如，假设一个 getData.php 用于为数据对象返回 JSON，但在更新后，它返回一个对象数组。更新后运行的任何旧客户端脚本仍然需要一个对象，并且当它收到一个数组时它会中断。用户需要刷新页面，这样他才能获得知道如何处理对象数组的新客户端脚本。
是的，这是我建议的第一个解决方案（示例代码的前两部分）。