前端重新部署后如何让用户刷新页面？

[kongkongye]

目前碰到的情况是前端重新构建部署后，js 之类文件名都变了，前端点击另一个页面就白屏（控制台报错 js 文件找不到），而很多用户比较小白就会反馈页面出问题了而不是刷新页面。
所以想着重新部署后应该通知到用户应该刷新前端页面，目前能想到的方式是所有请求都自动加上前端当前版本，通过工具重新构建后通知后端修改前端最新版本号，然后前端页面请求时就能返回信息让前端提示页面需要刷新，不知有没更好的办法？

[WenJimmy]

和 22 楼一样
生产构建的时候生成一个 version.json 一并发布到网站目录,在路由守卫和接口请求前检查根目录 json 内容，不一致就提醒更新

[coolzjy]

1. 所有资源上传 OSS 保留历史版本
2. 使用 MPA ，切换页面直接请求新的 html
3. 不使用 code splitting ，所有页面打成一个包

加版本、每次检查、提示刷新这套方案不管从技术上还是从用户角度都太不友好了。

[ymcz852]

@wenzichel 大佬，不好意思打扰了，想问下按照你这种方案的话，具体是怎么操作呢？每次打包都会生成新的 html 和 js 等静态资源的包，那么 oss 上就会有新的 A 包和旧的 B 包，cdn 那个地址要如何指向新的 A 包里的 html 呢？是要用先访问 Ngnix 的地址，然后指向 cdn 里的新的 A 包里的 html 吗？

[wenzichel]

@ymcz852 我们这里，是 html 页面和 js 等静态资源都是发到 CDN 上，只不过 html 页面的过期时间会短一点（ 5 分钟左右）。为保证访问的链接不变，html 发布是固定的名字，而 js 等资源就是 hash 的增量更新。无论用户访问是之前旧的 html ，还是发布的最新的 html ，都有其对应的静态资源。

我想，没有哪个业务可以极端到在发布新包后，一定要让用户在第一时间更新到最新的文件。

旧 html 里访问的是旧的静态资源，新 html 就访问新的 html 资源。等用户的旧 html 页面缓存过期了，就自动访问新的 html 页面了，就可以了。

当然，如果一定在发布后，所有用户都访问最新的资源，那就模仿游戏里的“停机维护”。在发布之前，所有的访问都导向到维护页面，等发布完成后，再把流量导过来。

[ymcz852]

@wenzichel `为保证访问的链接不变，html 发布是固定的名字`请问这里是如何操作的，如何通过固定的链接访问到不同的包里的 html 呢？

[ImmerTry]

@DOLLOR 请教一下，这段代码添加到哪个文件上啊

[GreatAuk]

因为前端项目是容器部署，不知道怎么做增量更新，所以自己写了个打包插件 https://github.com/GreatAuk/plugin-web-update-notification ，通知用户刷新页面。楼上用打包时间当版本号的想法也不错，我到时也加下这个功能😁。

[ImmerTry]

@lerry 那本地在获取到的时候 是不是要存进 session storage 里面去啊

[lerry]

@ImmerTry #48 存变量就行

[ImmerTry]

@lerry 好的，谢谢，还有一点就是每次上包的时候是覆盖更新，还是要把旧的删除掉在换包