90 lines
2.5 KiB
Markdown
90 lines
2.5 KiB
Markdown
# 解决HTTPS访问后端接口问题
|
||
|
||
## 问题现象
|
||
访问 `https://jarvis.van333.cn` 时，前端请求仍然是 `http://134.175.126.60:30313/captchaImage`，导致混合内容错误。
|
||
|
||
## 原因分析
|
||
1. **缺少环境变量配置文件**：`.env.production` 文件不存在，打包时使用了默认值
|
||
2. **打包后的代码包含硬编码IP**：如果之前打包时使用了IP地址，需要重新打包
|
||
|
||
## 解决步骤
|
||
|
||
### 1. 创建环境变量文件
|
||
|
||
请在项目根目录手动创建以下两个文件：
|
||
|
||
#### `.env.development`（开发环境）
|
||
```
|
||
# 开发环境配置
|
||
# 开发环境使用代理路径，通过vue.config.js的devServer代理到后端
|
||
VUE_APP_BASE_API=/dev-api
|
||
```
|
||
|
||
#### `.env.production`（生产环境）
|
||
```
|
||
# 生产环境配置
|
||
# 生产环境使用相对路径，通过nginx代理到后端
|
||
VUE_APP_BASE_API=/dev-api
|
||
```
|
||
|
||
**或者运行批处理文件：**
|
||
```
|
||
双击运行：创建环境变量文件.bat
|
||
```
|
||
|
||
### 2. 重新打包项目
|
||
|
||
```bash
|
||
npm run build:prod
|
||
```
|
||
|
||
### 3. 部署到服务器
|
||
|
||
将 `dist` 目录中的文件部署到 `/www/sites/jarvis.van333.cn/index/`
|
||
|
||
### 4. 配置Nginx
|
||
|
||
确保使用 `nginx-https.conf` 中的配置，关键部分：
|
||
|
||
```nginx
|
||
location /dev-api/ {
|
||
proxy_pass http://127.0.0.1:30313/;
|
||
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_set_header X-Forwarded-Proto $scheme;
|
||
}
|
||
```
|
||
|
||
### 5. 重启Nginx
|
||
|
||
```bash
|
||
sudo nginx -t
|
||
sudo nginx -s reload
|
||
```
|
||
|
||
## 验证
|
||
|
||
1. **清除浏览器缓存**，强制刷新（Ctrl+F5）
|
||
2. **打开开发者工具**（F12），查看Network标签
|
||
3. **确认API请求**应该是：
|
||
- ✅ `https://jarvis.van333.cn/dev-api/captchaImage`
|
||
- ❌ 不是 `http://134.175.126.60:30313/captchaImage`
|
||
|
||
## 注意事项
|
||
|
||
1. **必须重新打包**：修改环境变量后，必须重新运行 `npm run build:prod`
|
||
2. **清除浏览器缓存**：旧的打包文件可能被浏览器缓存
|
||
3. **检查nginx配置**：确保 `/dev-api/` 路径的代理配置正确
|
||
4. **检查后端服务**：确保后端服务运行在 `127.0.0.1:30313`
|
||
|
||
## 如果仍然有问题
|
||
|
||
1. 检查打包后的 `dist/static/js/` 目录中的JS文件，搜索是否包含 `134.175.126.60`
|
||
2. 如果找到，说明打包时环境变量未生效，检查：
|
||
- `.env.production` 文件是否存在
|
||
- 文件内容是否正确（`VUE_APP_BASE_API=/dev-api`）
|
||
- 是否在正确的目录（项目根目录）
|
||
- 重新打包前是否删除了旧的 `dist` 目录
|
||
|