58 lines
2.9 KiB
Markdown
58 lines
2.9 KiB
Markdown
---
|
||
name: session-20260612-2
|
||
description: 2026-06-12 第2次会话 — VPN网络带宽诊断、Nginx代理丢失gzip修复、共享静态资源域名解决双域重复加载
|
||
metadata:
|
||
type: session
|
||
date: 2026-06-12
|
||
sessionNumber: 2
|
||
startTime: 2026-06-12T19:30:00+08:00
|
||
---
|
||
|
||
# 2026-06-12 第2次会话
|
||
|
||
## 会话摘要
|
||
用户反馈 Vue 前端通过 VPN 访问非常慢（JS/CSS 加载要 1 分钟）。诊断发现根因是 Nginx 代理层（10.20.1.160）丢失了 gzip 压缩，导致 1MB+ 的文件通过 VPN 窄带宽原样传输。用户自行修复。
|
||
|
||
## 关键操作
|
||
|
||
### VPN 网络诊断 — 前端加载慢
|
||
- **问题现象**: 通过域名 `web.gw.zgitm.com` 访问前端，JS/CSS 加载要 40 秒~1 分钟
|
||
- **网络拓扑**: 用户电脑(10.20.1.5) → 公网VPN → 阿里云VPN(10.20.1.1) → Nginx代理(10.20.1.160) → 前端服务(10.20.1.170:5001)
|
||
- **域名解析**: `web.gw.zgitm.com` 和 `login.user.zgitm.com` 均解析到 10.20.1.160
|
||
- **实测数据**:
|
||
|
||
| 路径 | el.js (1.08MB) 耗时 | gzip |
|
||
|------|---------------------|------|
|
||
| 内网 10.1.1.170:5001 | 19ms | ✅ |
|
||
| VPN直连 10.20.1.170:5001 | 3-10秒 | ✅ |
|
||
| Nginx代理 web.gw.zgitm.com | 20-40秒 | ❌ 丢失 |
|
||
|
||
- **根因**: 10.20.1.170 上的 Nginx 返回 gzip 压缩内容，但 10.20.1.160 Nginx 代理时丢失了 gzip 压缩，导致 1MB+ 文件通过窄带宽 VPN 原样传输
|
||
- **Ping延迟**: 5-15ms（正常），**不是延迟问题是带宽+压缩问题**
|
||
- **修复方案**: 在 10.20.1.160 Nginx 配置中添加 `proxy_set_header Accept-Encoding "gzip"` 和/或开启本地 gzip — 用户自行修复
|
||
|
||
## 重要信息
|
||
- VPN 网关: 10.20.1.1（阿里云）
|
||
- VPN 子网: 10.20.1.x
|
||
- 前端服务: 10.20.1.170:5001（内网 10.1.1.170:5001）
|
||
- Nginx 代理: 10.20.1.160
|
||
- DNS 服务器: 10.20.1.150
|
||
- 公网 IP: zgitm.com → 8.133.197.85
|
||
- 生产前端域名: web.gw.zgitm.com, login.user.zgitm.com
|
||
- Nginx 版本: 160 上是 1.14.1，170 上是 1.30.2
|
||
|
||
### 共享静态资源域名 — 解决 login/web 双域名重复加载
|
||
- **问题**: login.user.zgitm.com 登录后跳转 web.gw.zgitm.com，同一份 JS/CSS 被两个域名各自下载一次
|
||
- **方案**: Vite 构建设置 `base` 为统一静态域名，HTML 中资源 URL 用绝对路径
|
||
- **第一版**: `http://web.wg.static.zgitm.com:5001/` — 遇到 Mixed Content 问题（HTTPS 页面加载 HTTP 资源被浏览器拦截）
|
||
- **最终版**: `https://web.gw.zgitm.com/` — 复用已有 HTTPS 域名，零额外配置
|
||
- **改动文件**:
|
||
- `vite.config.ts` — 引入 loadEnv，build 时 base 读取 VITE_STATIC_URL，dev 回退 '/'
|
||
- `.env.production` — 新增 `VITE_STATIC_URL=https://web.gw.zgitm.com/`
|
||
- **效果**: login 域名首次下载资源后，跳转到 web 域名时浏览器缓存直接命中，0 网络请求
|
||
|
||
## 待处理
|
||
- [ ] 重新 `npm run build` + 部署后验证效果
|
||
- [ ] 如果后续还慢，考虑 Vite 拆包 Element Plus 按需加载
|
||
- [ ] 考虑 160 Nginx 升级 gzip 压缩级别
|