通知用户在 SPA 网站上刷新浏览器的正确方法是啥（更改 .js 文件时）

Posted 2023-02-22

【中文标题】通知用户在 SPA 网站上刷新浏览器的正确方法是啥（更改 .js 文件时）

【英文标题】：What's the proper way to inform users to refresh the browser on a SPA website (when .js files are changed)通知用户在 SPA 网站上刷新浏览器的正确方法是什么（更改 .js 文件时）

【发布时间】：2019-09-12 09:14:24

【问题描述】：

我正在寻找一种适当的方式来通知用户有关更新的网站版本。

每当我上传新的生产 .js 文件时，网站的某些部分在不刷新浏览器的情况下仍然可以正常工作，但大多数都不能，用户可能永远不会想到只刷新浏览器。

每当上传新的 .js 文件时，如何自动通知用户刷新浏览器？

我正在使用 Vue 和 Laravel-mix。

【问题讨论】：

如何在 js-script 包含命令中添加一个缓存中断器，例如版本号？

可能重复***.com/questions/53486531/…

【参考方案1】：

需要一个缓存破坏器，并且可以使用例如自动化。 gulp-rev：这个概念是在每次构建时重命名资源文件，这样当用户打开你的应用程序时就不会从缓存中检索它们。

但如果浏览器选项卡打开并且在用户使用应用程序时完成升级是不够的。在这种情况下，您可能希望显示一条模式消息来刷新页面，或者自动刷新以加载新版本。

为此，您应该在首次打开应用程序时将版本号（或 git commit hash）存储在您的 SPA 范围内的某个位置，并通过 Web 服务调用定期检查当前后端版本。如果您检测到版本更改，您将显示该消息（并阻止用户使用其旧版本）。

【讨论】：

感谢您的回答。我已经使用了缓存破坏器，但是有几个用户从不关闭选项卡，因此，他们使用已经导入的旧 .js 文件。我正在考虑与您在邮件第二部分中描述的类似的事情，但希望这些天有更好的方法来处理这种情况。