7.4 KiB
Executable File
Raw Permalink Blame History

生产环境部署指南

一、服务器地址配置说明

1. 当前代码中的服务器地址配置位置

代码中使用了相对路径作为 API 的 baseURL这意味着

  • 开发环境:通过 Vite 代理转发到后端服务器
  • 生产环境:需要通过 Nginx 等反向代理服务器配置转发

代码中的 API 路径配置:

  1. 登录接口 (src/request/http.ts)

    • baseURL: /dada
    • 开发环境代理:vite.config.ts 第 44-48 行
  2. 智能审核接口 (src/request/reviewHttp.ts)

    • baseURL: /ai-review/api
    • 开发环境代理:vite.config.ts 第 25-29 行
  3. 智能写作接口 (src/request/writingHttp.ts)

    • baseURL: /ai-doc/api
    • 开发环境代理:vite.config.ts 第 31-35 行
  4. AI助手对话接口 (src/api/finyxbot.ts)

    • baseURL: /finyx-bot/api
    • 开发环境代理:vite.config.ts 第 37-41 行

2. 开发环境服务器地址

当前开发环境配置的服务器地址为:https://finyxdev.datacubeworld.com

位置:vite.config.ts 第 26、32、38、45 行

// 开发环境代理配置(仅开发时使用)
proxyConf['/ai-review/api'] = {
  target: 'https://finyxdev.datacubeworld.com',  // 开发环境地址
  changeOrigin: true,
  rewrite: (path) => path.replace(ENV.VITE_BASE_PATH, '/')
}

二、生产环境部署步骤

步骤 1修改开发环境代理地址可选

如果需要在开发环境测试生产服务器,可以修改 vite.config.ts 中的 target 地址:

// 将以下地址改为你的生产环境地址
const PROD_SERVER = 'https://your-production-server.com'

proxyConf['/ai-review/api'] = {
  target: PROD_SERVER,
  changeOrigin: true,
  rewrite: (path) => path.replace(ENV.VITE_BASE_PATH, '/')
}

proxyConf['/ai-doc/api'] = {
  target: PROD_SERVER,
  changeOrigin: true,
  rewrite: (path) => path.replace(ENV.VITE_BASE_PATH, '/')
}

proxyConf['/finyx-bot/api'] = {
  target: PROD_SERVER,
  changeOrigin: true,
  rewrite: (path) => path.replace(ENV.VITE_BASE_PATH, '/')
}

proxyConf['/dada'] = {
  target: PROD_SERVER,
  changeOrigin: true,
  rewrite: (path) => path.replace(ENV.VITE_BASE_PATH, '/')
}

步骤 2构建生产版本

# 构建生产版本
pnpm run build:prd

# 或者
pnpm run build

构建完成后,会在 dist 目录生成静态文件。

步骤 3配置 Nginx 反向代理

生产环境需要配置 Nginx 反向代理,将前端请求转发到后端服务器。

Nginx 配置示例:

server {
    listen 80;
    server_name your-domain.com;
    
    # 前端静态文件目录
    root /path/to/your/dist;
    index index.html;

    # 前端路由Vue Router history 模式)
    location / {
        try_files $uri $uri/ /index.html;
    }

    # 登录接口代理
    location /dada {
        proxy_pass https://your-production-server.com;
        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;
        proxy_ssl_verify off;
    }

    # 智能审核接口代理
    location /ai-review/api {
        proxy_pass https://your-production-server.com;
        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;
        proxy_ssl_verify off;
    }

    # 智能写作接口代理
    location /ai-doc/api {
        proxy_pass https://your-production-server.com;
        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;
        proxy_ssl_verify off;
    }

    # AI助手对话接口代理
    location /finyx-bot/api {
        proxy_pass https://your-production-server.com;
        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;
        proxy_ssl_verify off;
    }

    # WebSocket 支持(如果需要)
    location /finyx-bot/api/v1/chat/stream {
        proxy_pass https://your-production-server.com;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        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;
        proxy_read_timeout 3600s;
        proxy_ssl_verify off;
    }

    # 静态资源缓存
    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
    }
}

重要提示

  • your-production-server.com 替换为你的实际生产环境服务器地址
  • your-domain.com 替换为你的实际域名
  • /path/to/your/dist 替换为实际的 dist 目录路径

步骤 4部署静态文件

将构建好的 dist 目录内容上传到服务器,并确保 Nginx 配置的 root 路径正确。

步骤 5重启 Nginx

# 测试 Nginx 配置
sudo nginx -t

# 重启 Nginx
sudo systemctl restart nginx
# 或
sudo service nginx restart

三、环境变量配置(可选)

如果需要使用环境变量,可以在 env 目录下创建环境变量文件:

创建 env/.env.production 文件:

# 基础路径
VITE_BASE_PATH=/

# 应用端口(开发环境)
VITE_APP_PORT=5173

# 构建模式
VITE_BUILD=PRD

# Mock 服务器(开发环境)
VITE_MOCK_DEV_SERVER=false

四、常见问题

Q1: 如何确认当前连接的是哪个服务器?

开发环境

  • 查看浏览器开发者工具的 Network 面板
  • 查看请求的实际 URL开发环境会显示为 localhost:5173 开头的地址

生产环境

  • 查看浏览器开发者工具的 Network 面板
  • 查看请求的 Response Headers 中的 X-Forwarded-Host 或实际请求的域名

Q2: 生产环境如何切换服务器地址?

生产环境的服务器地址在 Nginx 配置中设置,修改 proxy_pass 后面的地址即可:

location /dada {
    proxy_pass https://new-production-server.com;  # 修改这里
    # ... 其他配置
}

修改后需要:

  1. 测试配置:sudo nginx -t
  2. 重新加载:sudo nginx -s reload 或重启 Nginx

Q3: 代码中需要修改服务器地址吗?

不需要。代码中使用的是相对路径(如 /dada/ai-review/api),这些路径会通过 Nginx 代理转发到实际的后端服务器。只需要在 Nginx 配置中修改 proxy_pass 的目标地址即可。

Q4: 如何同时支持多个环境?

可以通过环境变量和 Nginx 配置来实现:

  1. vite.config.ts 中根据环境变量动态设置代理地址
  2. 在 Nginx 配置中使用变量或不同的 server 块来区分环境

五、总结

  1. 开发环境:服务器地址在 vite.config.ts 的代理配置中(第 26、32、38、45 行)
  2. 生产环境:服务器地址在 Nginx 配置proxy_pass 中设置
  3. 代码中:使用相对路径,无需修改代码即可切换服务器
  4. 部署流程:构建 → 上传静态文件 → 配置 Nginx → 重启服务