From 855d22f44827e986febde318df14cbcfaeb0c029 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=8D=92?= Date: Wed, 5 Nov 2025 13:27:52 +0800 Subject: [PATCH] 1 --- .env.development | 2 +- .env.production | 2 +- nginx-https.conf | 19 +------- vue.config.js | 4 +- 修复环境变量.txt | 56 +++++++++++++++++++++++ 创建环境变量文件.bat | 20 +++++++++ 快速修复指南.md | 104 +++++++++++++++++++++++++++++++++++++++++++ 配置说明.md | 89 ++++++++++++++++++++++++++++++++++++ 8 files changed, 275 insertions(+), 21 deletions(-) create mode 100644 修复环境变量.txt create mode 100644 创建环境变量文件.bat create mode 100644 快速修复指南.md create mode 100644 配置说明.md diff --git a/.env.development b/.env.development index 4ddef58..a48e59e 100644 --- a/.env.development +++ b/.env.development @@ -7,6 +7,6 @@ ENV = 'development' # 路由懒加载 VUE_CLI_BABEL_TRANSPILE_MODULES = true -VUE_APP_BASE_API = 'http://134.175.126.60:30313' +VUE_APP_BASE_API=/jarvis-api # VUE_APP_BASE_API = 'http://127.0.0.1:30313' port = 8888 diff --git a/.env.production b/.env.production index 9fbf428..652a695 100644 --- a/.env.production +++ b/.env.production @@ -6,5 +6,5 @@ ENV = 'production' # Jarvis/生产环境 -VUE_APP_BASE_API = '/jarvis-api' +VUE_APP_BASE_API=/jarvis-api port = 8888 diff --git a/nginx-https.conf b/nginx-https.conf index 2a6919a..30b8a69 100644 --- a/nginx-https.conf +++ b/nginx-https.conf @@ -63,24 +63,7 @@ server { proxy_read_timeout 600s; } - # Swagger API文档代理（如果需要） - location /v3/api-docs/ { - proxy_pass http://127.0.0.1:30313/v3/api-docs/; - 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; - } - - # Swagger UI代理（如果需要） - location /swagger-ui/ { - proxy_pass http://127.0.0.1:30313/swagger-ui/; - 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; - } - + # Druid监控代理（如果需要） location /druid/ { proxy_pass http://127.0.0.1:30313/druid/; diff --git a/vue.config.js b/vue.config.js index 1eed0f8..09fb9d2 100644 --- a/vue.config.js +++ b/vue.config.js @@ -10,7 +10,9 @@ const CompressionPlugin = require('compression-webpack-plugin') const name = process.env.VUE_APP_TITLE || 'Jarvis' // 网页标题 // 后端接口地址（仅用于开发环境代理） -const baseUrl = process.env.VUE_APP_BASE_API || 'http://127.0.0.1:30313' // 后端接口 +// 生产环境应该使用相对路径（如 /dev-api），通过nginx代理 +// 开发环境可以使用相对路径（通过devServer代理）或绝对URL +const baseUrl = process.env.VUE_APP_BASE_API || (process.env.NODE_ENV === 'production' ? '/dev-api' : 'http://127.0.0.1:30313') // 开发环境代理路径（如果未设置VUE_APP_BASE_API，使用默认代理路径） const devApiPath = process.env.VUE_APP_BASE_API || '/dev-api' diff --git a/修复环境变量.txt b/修复环境变量.txt new file mode 100644 index 0000000..6bb55f9 --- /dev/null +++ b/修复环境变量.txt @@ -0,0 +1,56 @@ +请手动修改以下两个文件： + +=========================================== +文件1：.env.development +=========================================== +将以下内容： +VUE_APP_BASE_API = 'http://134.175.126.60:30313' + +改为： +VUE_APP_BASE_API=/dev-api + +完整文件内容应该是： +# 页面标题 +VUE_APP_TITLE=Jarvis + +# 开发环境配置 +ENV=development + +# 路由懒加载 +VUE_CLI_BABEL_TRANSPILE_MODULES=true + +# 开发环境使用代理路径，通过vue.config.js的devServer代理到后端 +VUE_APP_BASE_API=/dev-api + +port=8888 + +=========================================== +文件2：.env.production +=========================================== +将以下内容： +VUE_APP_BASE_API = '/jarvis-api' + +改为： +VUE_APP_BASE_API=/dev-api + +完整文件内容应该是： +# 页面标题 +VUE_APP_TITLE=Jarvis + +# 生产环境配置 +ENV=production + +# 生产环境使用相对路径，通过nginx代理到后端 +# 注意：这里的路径必须与nginx配置中的 location /dev-api/ 保持一致 +VUE_APP_BASE_API=/dev-api + +port=8888 + +=========================================== +重要提示： +=========================================== +1. 注意等号两边不要有空格（VUE_APP_BASE_API=/dev-api，不是 VUE_APP_BASE_API = /dev-api） +2. 不要使用引号（直接写 /dev-api，不要写 '/dev-api' 或 "/dev-api"） +3. 修改后必须重新打包：npm run build:prod +4. 确保nginx配置中的 location /dev-api/ 与前端配置一致 + diff --git a/创建环境变量文件.bat b/创建环境变量文件.bat new file mode 100644 index 0000000..66c2295 --- /dev/null +++ b/创建环境变量文件.bat @@ -0,0 +1,20 @@ +@echo off +chcp 65001 >nul +echo 正在创建环境变量配置文件... + +echo # 开发环境配置 > .env.development +echo # 开发环境使用代理路径，通过vue.config.js的devServer代理到后端 >> .env.development +echo VUE_APP_BASE_API=/dev-api >> .env.development + +echo # 生产环境配置 > .env.production +echo # 生产环境使用相对路径，通过nginx代理到后端 >> .env.production +echo VUE_APP_BASE_API=/dev-api >> .env.production + +echo. +echo 环境变量文件创建完成！ +echo .env.development - 开发环境配置 +echo .env.production - 生产环境配置 +echo. +echo 请重新打包项目：npm run build:prod +pause + diff --git a/快速修复指南.md b/快速修复指南.md new file mode 100644 index 0000000..82b9fa1 --- /dev/null +++ b/快速修复指南.md @@ -0,0 +1,104 @@ +# 快速修复：HTTPS访问后端接口问题 + +## 问题 +访问 `https://jarvis.van333.cn` 时，前端请求仍然是 `http://134.175.126.60:30313/captchaImage` + +## 立即执行以下步骤 + +### 步骤1：创建环境变量文件 + +在项目根目录 `d:\code\ruoyi-vue\` 下，创建两个文件： + +#### 文件1：`.env.development` +内容： +``` +VUE_APP_BASE_API=/dev-api +``` + +#### 文件2：`.env.production` +内容： +``` +VUE_APP_BASE_API=/dev-api +``` + +**创建方法（Windows）：** +1. 在项目根目录打开命令行 +2. 执行： + ```cmd + echo VUE_APP_BASE_API=/dev-api > .env.development + echo VUE_APP_BASE_API=/dev-api > .env.production + ``` + +或者手动创建： +1. 在项目根目录新建文件 `.env.development` +2. 在项目根目录新建文件 `.env.production` +3. 两个文件内容都是：`VUE_APP_BASE_API=/dev-api` + +### 步骤2：删除旧的打包文件（如果存在） + +```cmd +cd d:\code\ruoyi-vue +rmdir /s /q dist +``` + +### 步骤3：重新打包 + +```cmd +npm run build:prod +``` + +### 步骤4：部署到服务器 + +将 `dist` 目录中的所有文件复制到服务器的 `/www/sites/jarvis.van333.cn/index/` 目录 + +### 步骤5：确认Nginx配置 + +确保nginx配置文件中包含： + +```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; +} +``` + +### 步骤6：重启Nginx + +```bash +sudo nginx -t +sudo nginx -s reload +``` + +### 步骤7：清除浏览器缓存并测试 + +1. 按 `Ctrl + Shift + Delete` 清除浏览器缓存 +2. 或者按 `Ctrl + F5` 强制刷新 +3. 打开开发者工具（F12）查看Network请求 +4. 确认请求URL是 `https://jarvis.van333.cn/dev-api/captchaImage` + +## 验证配置是否正确 + +打包完成后，检查打包后的文件： + +```cmd +cd d:\code\ruoyi-vue\dist\static\js +findstr /s /i "134.175.126.60" *.js +``` + +如果找到包含该IP的文件，说明环境变量未生效，需要： +1. 确认 `.env.production` 文件存在且内容正确 +2. 删除 `dist` 目录后重新打包 +3. 确认打包命令是 `npm run build:prod`（不是 `npm run build`） + +## 如果还是不行 + +检查 `vue.config.js` 第15行，应该是： +```javascript +const baseUrl = process.env.VUE_APP_BASE_API || (process.env.NODE_ENV === 'production' ? '/dev-api' : 'http://127.0.0.1:30313') +``` + +如果不对，说明配置未更新，需要重新保存 `vue.config.js` 文件。 + diff --git a/配置说明.md b/配置说明.md new file mode 100644 index 0000000..b022d45 --- /dev/null +++ b/配置说明.md @@ -0,0 +1,89 @@ +# 解决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` 目录 +