背景：
react 的 SPA 项目，以前都是手动打包上传服务器解压到目录，每次都是增量更新，nginx 指向静态目录，这种方式的优劣：
- 优势：正在访问页面的用户不会受影响
- 劣势：目录内文件会随着发布次数增加逐渐膨胀，需要定期清理
最近用上了 gitlab 的 CI/CD ，直接打包生成 docker 镜像自动到服务器部署，这样确实轻松不少，但是会有一些问题：
- 优势：部署流程简化
- 劣势：正在访问页面的用户会存在动态加载资源（如路由懒加载 js ）失败的情况
尝试解决
- pwa ，存在无法更新资源的问题（不知道是不是姿势不对）
- 保留上一次构建产物，合并本次构建产物生成一份新的资源，但是复杂度会变高
请教各位
在不进行大规模的变动的情况下，有没有更简单的办法解决这个问题，感谢~
 |
1
billzhuang 22 天前 via iPhone
这东西有自己路由么？能直接部署在对象存储开启静态网站，然后前面套个 CDN 么？
|
 |
2
iOCZS 22 天前
没有银弹，夜里更新呗
|
 |
3
evill 22 天前
"劣势：正在访问页面的用户会存在动态加载资源（如路由懒加载 js ）失败的情况" 感觉像是直接 down and UP ?
尝试用灰度切流呗 |
 |
4
bzw875 22 天前
不可能的。某个员工休产假回来页面也留了 3 个月，你也要保证她路由懒加载可用吗？
|
 |
5
newaccount 22 天前
我选择保留所有旧版本资源，硬盘又不值钱
就算是被人说贵的阿里云，每月每 G 都不到一块钱，这玩真不值得折腾 |
 |
6
fliu2476 OP @billzhuang 这个也可以，不过又要弄个 cdn ，感觉有些麻烦了
|
|
9
fliu2476 OP @newaccount 道理是这样哈哈哈，但是还是想折腾个好方案
|
 |
10
wu67 22 天前
重要的在公司公告渠道发更新公告.
不重要的错开高峰使用期更新就行. 例如给内部用的系统, 直接就下班后更新, 要么就刚上班的时候更新... |
|
11
newaccount 22 天前
@fliu2476 #9 实在想折腾你就写个脚本，判断文件夹的更新日期，然后定期删除超过这个日期一个月的文件
|
 |
12
han3sui 22 天前
html 文件在 docker 里，资源文件在 oss ，前面套个 cdn
|
 |
13
zhhqiang 22 天前
通知客户刷新 - - 我就这么干的
|
|
14
evill 22 天前
最简单的方式，前端加载时获取一下版本，并每次请求时 header 带上版本
在 LB(nginx 、HA.....)上判断 header ，做个简单的 AB 当时这是最简单，实际情况还要按照项目配合 |
|
17
billzhuang 22 天前 via iPhone
纯静态资源，不应该放在 docker 或者 nginx 下，对象存储+开启静态网站+CDN 才是最简单的。
|
 |
18
fgk 22 天前
增量，存储不值钱。公司成本看 更不会放在眼里
|
 |
19
w292614191 22 天前
可以先挂载 nginx 的 html 到 gitlab-runner 环境，docker 构建后复制到目录覆盖完事，这样是无感部署的。
也可以用 jenkins 的 docker 模式来构建，也是映射项目到容器环境，大概是这样的： ` docker run --rm \ -v "${SAFE_WORKSPACE}:/app" \ -v "${MAVEN_REPO}:/root/.m2" \ -w /app \ maven:3.6.3-openjdk-17 \ sh -c "mvn -Dmaven.test.skip=true clean package" `  |
|
20
w292614191 22 天前  1
@w292614191 #19 前端也是类似的：
` # 处理特殊字符 SAFE_WORKSPACE=$(echo "${WORKSPACE}" | tr ' ' '_' | tr -d '()') rm -rf dist echo '复制文件到容器中构建' docker run --rm \ -v "${SAFE_WORKSPACE}:/app" \ -w /app \ node:18 \ sh -c "npm config set registry https://registry.npmmirror.com && npm install -g pnpm && \ pnpm config set registry https://registry.npmmirror.com && \ pnpm install && pnpm run build " ` |
 |
21
dropsio 22 天前
可以考虑不缓存入口页面，然后拦截 route 的错误信息，然后接管 query ，做刷新跳转。这样就既能防止动态资源丢失而导致的页面崩溃，又不需要依赖 cdn ，也不用设计管理 pwa 。改动最小。
|
 |
22
echoless 22 天前
加载失败的时候， 提醒用户刷新。
|
Select Language