大佬们关于这种前端容器滚动更新的问题有什么解决方案吗？

121 天前
 2Nfree

服务是内部服务，没有 CDN, 前端容器用 K8S 托管 现在发现一个问题： 前端滚动发布后，用户侧没关闭旧页面，还是指向之前的 js ，就会报错 Failed to loadmodule script: Expected JavaScriptmodule script but the server responded with a MIME type of "text/htmi".Strict MIME type checking is enforcedfor module scripts per HTML spec.

现在想的解决办法就是更新后通知用户刷新，还有什么其他的方案吗？

3186 次点击
所在节点    程序员
33 条回复
julyclyde
121 天前
别用容器
你需要的是一个累积的存储装置，而不是可替换的存储装置
zzhirong
121 天前
出现这个问题的原因是，更新后，旧版本的 js 文件不存在了，然后，旧的页面链接还是指向旧的 js 文件，获取的时候，返回了 404.html （或其他），你这种情况可能是由于使用文件名来做版本控制（同一 js 文件不同版本不同的文件名），我能想到的方法是，固定 js 链接地址，再由后端来决定返回什么版本的 js ，或使用 HTTP Etag 头来做版本控制。
learnshare
121 天前
1. 保留原有资源，包括静态文件和 API
2. 更新和上线新版本
3. 通知用户有更新，可以选择刷新或跳过

PWA 应用里比较常见
https://vite-pwa-org-zh.netlify.app/guide/prompt-for-update
foolishcrab
121 天前
内部服务就让用户刷新一下，别折腾
对客的你研究下静态资源发布吧，说复杂也挺复杂的一套东西
2Nfree
121 天前
@foolishcrab #4 嗯，现在想的就是让用户刷新，对客我们用的是 SSR 暂时没有这种问题
2Nfree
121 天前
@julyclyde #1 架构这一块估计我们不太会去折腾了
2Nfree
121 天前
@julyclyde
@zzhirong
@learnshare
@foolishcrab
感谢各位大佬
eudore
121 天前
为什么页面在加载之后还会加载 js ？不应该首次加载后加载所有 js 吗？ 在更新瞬间访问导致版本不一样可以忽略，可以让 404 返回一段 js 去刷新页面。
hahasong
121 天前
前端请求带上应用版本号，后端发现版本过低报错前端弹窗要求刷新
superrichman
121 天前
window.setTimeout(function() {window.location.reload();}, 3600*1000);
shunia
121 天前
加一个针对这个异常的错误捕获，在捕获后弹窗提示用户刷新。
zhangkai1024
121 天前
我们在路由中捕获错误，根据错误的 error message 的某些关键特征命中有新的版本，并给出一个关不掉的 dialog 提示手动刷新
9ki
121 天前
目前我们是弹窗，如果发现有更新则强制弹窗提示告知用户，用户只能刷新

我了解到比较完美的方式是蓝绿发布，但是我们服务器资源有限一直没尝试过

有些网站例如：perplexity 只要检测到更新立马刷新网页
xiaofeixiang
121 天前
两个解决方法：1 是静态文件传到静态资源服务器上，每次更新打包不删除上次的文件； 2 是每次打包生成一个版本号，然后页面轮训去查询是否版本更新，提醒用户刷新页面，这个有现成的插件，也可以自己手撸一个，不难
bestie
121 天前
@eudore 有个技术叫 lazyload ，访问到对应的路由才会加载 js
2Nfree
121 天前
参考了： https://juejin.cn/post/7307963529872785442?searchId=202504031219508E6AF286261E0B818E1E
guanzhangzhang
121 天前
小程序不就是版本不对让强制刷新的吗，看看类似原理？
momocraft
121 天前
让用户刷新页面其实问题更少，你也不知道用户浏览器一直跑旧代码会产生什么问题
YasinChan
121 天前
使用协商缓存缓存
ZZITE
121 天前
一个是你参考的那样，对比版本进行主动的刷新提示。另外一般还需要再路由中或者全局对异常进行捕获，避免 lazyload 的部分在旧页面直接加载，导致程序崩溃。
其实还有一种无感刷新的方式，但你这个场景考虑上面两种场景就可以了。

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://ex.noerr.eu.org/t/1123087

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX