BLOG

改代码到部署

2026/05/02 3 min read BLOG 编程规范 改代码到部署

好,这一条我给你整理成一套完整、正确、以后不再出错的流程,从“改代码 → build → 部署 → 验证 → 接口”全部打通,一次讲清楚。


🧠 一、整体正确思路(先记住这个)

分层处理,按顺序走,任何一步不对都不能往下跳

1. 前端代码
2. 前端 build
3. 上传到 data/public
4. 确认 index.html 生效(hash)
5. 浏览器加载正确资源
6. nginx 转发正确
7. 后端接口正常
8. token / 业务逻辑

👉 这就是完整链路


🧱 二、从修改到上线的正确流程(标准版)


✅ 第 1 步:修改前端代码

frontend/src/...

👉 比如:

  • AccountsView.vue

  • DataTable.vue


✅ 第 2 步:只从唯一入口 build

cd frontend
npm run build

❗必须记住

唯一产物 = frontend/dist

禁止:

❌ backend/internal/web/dist
❌ 手动改 JS 文件
❌ 覆盖 hash

✅ 第 3 步:上传到服务器

scp -r frontend/dist/* server-170:/srv/sub2api/deploy/data/public/

✅ 第 4 步:确认 index.html 已更新(关键)

ssh server-170 "
grep index- /srv/sub2api/deploy/data/public/index.html
"

👉 判断

  • ✔ 新 hash → 继续

  • ❌ 旧 hash → 上传失败(停)


✅ 第 5 步:确认线上返回的是同一份

curl https://sub2api.tengokukk.com | grep index-

👉 必须一致:

本地 index.html hash = 线上返回 hash

✅ 第 6 步:浏览器强刷

Ctrl + Shift + R

👉 避免缓存


🌐 三、nginx 正确配置(你刚修好的关键)


❗之前错误

location ^~ /api/ {
    proxy_pass http://127.0.0.1:8080;
}

👉 只转发 /api/*


✅ 正确做法(推荐)

location / {
    proxy_pass http://127.0.0.1:8080;
 
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
 
    proxy_http_version 1.1;
}

👉 含义:

所有路径(/responses /admin /xxx)
都转发给后端

🔌 四、接口验证流程(防止再乱)


✅ 第 7 步:直接测后端

curl -X POST http://127.0.0.1:8080/responses

✅ 第 8 步:测域名

iwr https://sub2api.tengokukk.com/responses -Method POST

👉 判断

返回 含义
405 nginx 拦了 ❌
401 到后端了 ✔
200 完全 OK ✔

🔐 五、token / 前端请求(最后一层)


浏览器看:

Network → /responses

检查:

Request Method: POST
Authorization: Bearer xxx

💥 六、你们刚刚犯的所有错误总结


❌ 错误 1:build 用错目录

backend/internal/web/dist ❌

❌ 错误 2:只传 assets,不传 index.html

JS 新 + HTML 旧 → 必炸

❌ 错误 3:手动改 hash

新文件 → 覆盖旧 hash ❌

❌ 错误 4:没确认 override 是否生效

没验证 index.html 就开始改 UI ❌

❌ 错误 5:nginx 路由错误(最致命)

只代理 /api/
→ /responses 直接 405

❌ 错误 6:没有分层排查

UI → 前端 → token → nginx(顺序完全反)

🎯 七、最终正确“最小操作流程”(以后就用这个)

只要改 UI:

cd frontend
npm run build
scp -r dist/* server:/srv/sub2api/deploy/data/public/

然后:

ssh server "grep index- /srv/sub2api/deploy/data/public/index.html"

刷新浏览器。


🧠 八、你必须记住的三条铁律


1️⃣ UI问题 ≠ 后端问题


2️⃣ 405 nginx 页面 = 没转发


3️⃣ index.html 决定一切


💬 最后一段总结(最重要)

你这次其实经历的是:

一个简单问题
→ 被多层误判
→ 扩散成系统级混乱

而正确流程其实一直很简单:

build → 上传 → 验证 hash → 看接口 → 再看 UI


如果你要,我可以帮你下一步直接做:

👉 一键部署 + 自动校验(不会再出错的那种)