大佬们关于这种前端容器滚动更新的问题有什么解决方案吗?
服务是内部服务,没有 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.
现在想的解决办法就是更新后通知用户刷新,还有什么其他的方案吗?
别用容器
你需要的是一个累积的存储装置,而不是可替换的存储装置
出现这个问题的原因是,更新后,旧版本的 js 文件不存在了,然后,旧的页面链接还是指向旧的 js 文件,获取的时候,返回了 404.html (或其他),你这种情况可能是由于使用文件名来做版本控制(同一 js 文件不同版本不同的文件名),我能想到的方法是,固定 js 链接地址,再由后端来决定返回什么版本的 js ,或使用 HTTP Etag 头来做版本控制。
- 保留原有资源,包括静态文件和 API
- 更新和上线新版本
- 通知用户有更新,可以选择刷新或跳过
PWA 应用里比较常见
vite-pwa-org-zh.netlify.app/guide/prompt-for-update
内部服务就让用户刷新一下,别折腾
对客的你研究下静态资源发布吧,说复杂也挺复杂的一套东西
#4 嗯,现在想的就是让用户刷新,对客我们用的是 SSR 暂时没有这种问题
#1 架构这一块估计我们不太会去折腾了
感谢各位大佬
为什么页面在加载之后还会加载 js ?不应该首次加载后加载所有 js 吗? 在更新瞬间访问导致版本不一样可以忽略,可以让 404 返回一段 js 去刷新页面。
前端请求带上应用版本号,后端发现版本过低报错前端弹窗要求刷新
window.setTimeout(function() {window.location.reload();}, 3600*1000);
加一个针对这个异常的错误捕获,在捕获后弹窗提示用户刷新。
我们在路由中捕获错误,根据错误的 error message 的某些关键特征命中有新的版本,并给出一个关不掉的 dialog 提示手动刷新
目前我们是弹窗,如果发现有更新则强制弹窗提示告知用户,用户只能刷新
我了解到比较完美的方式是蓝绿发布,但是我们服务器资源有限一直没尝试过
有些网站例如:perplexity 只要检测到更新立马刷新网页
两个解决方法:1 是静态文件传到静态资源服务器上,每次更新打包不删除上次的文件; 2 是每次打包生成一个版本号,然后页面轮训去查询是否版本更新,提醒用户刷新页面,这个有现成的插件,也可以自己手撸一个,不难
有个技术叫 lazyload ,访问到对应的路由才会加载 js
参考了: juejin.cn/post/7307963529872785442?searchId=202504031219508E6AF286261E0B818E1E
小程序不就是版本不对让强制刷新的吗,看看类似原理?
让用户刷新页面其实问题更少,你也不知道用户浏览器一直跑旧代码会产生什么问题
使用协商缓存缓存
一个是你参考的那样,对比版本进行主动的刷新提示。另外一般还需要再路由中或者全局对异常进行捕获,避免 lazyload 的部分在旧页面直接加载,导致程序崩溃。
其实还有一种无感刷新的方式,但你这个场景考虑上面两种场景就可以了。
index.html 文件 每次更新的时候覆盖
js 和 css 文件,打包的时候生成 hash ,也就是生成这种文件名 my-module-1.4494a73d5ba8bad5.js
保留以前的 js 和 css 文件
碰到过这个问题,我的解决方案是捕获全局路由错误,如果错误为”Failed to loadmodule script: Expected JavaScriptmodule...“,自动刷新后,跳转至用户目标地址。
使用 SSE 推送事件,强制刷新
#20 了解了,感谢大佬
自动刷新后,跳转至用户目标地址 -> 自动刷新并跳转至用户目标地址
#25 但是我感觉这种方式不能错误保证一定是因为 JS 更新导致的吧,万一有其他的问题导致了相同的报错是不是就会反复刷新
#26 现在我们的临时解决办法就是告诉用户更新了让他们自己刷新了,虽然感觉有点怪怪的,但是也还好
想一想,如果你要把一个图片的尺寸改小一点,你会怎么办?当然,我一定会启动一个图形编辑软件,然后,打开图片文件,从菜单上选择相关的工具选项,更改大小,然后保存文件。就算是在Lin…
我是用的 dockercompose 部署的,每次 docker up 都会重新创建镜像,日志自然也删除了。 项目的启动命令是:node server.js , 这种情况下,有…
又不加钱又要办事,快顶不住了,以推荐系统的内核低于 6 拒绝了,还有什么理由? ==== 根据最新文件,必须使用国产化系统,禁止 Liunx 、Ubantu 、redhat 等…