Vue 项目中配置代理服务器

---

在 Vue 项目中配置代理服务器，以下是常见的两种方式：

方式一：使用 Vue CLI 构建工具（在 vue.config.js 文件中配置）

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://your-target-api.com',  // 替换为实际的目标服务器地址
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
};

方式二：使用 Vite 构建工具（在 vite.config.js 文件中配置）

import { defineConfig } from 'vite';

export default defineConfig({
  server: {
    proxy: {
      '/api': {
        target: 'http://your-target-api.com',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      }
    }
  }
});

在上述配置中：

• '/api' 是要被代理的请求路径前缀。
• target 是代理的目标服务器地址。
• changeOrigin 用于修改请求头中的 Host 字段，模拟请求来自目标服务器。
• pathRewrite 用于重写请求路径，去除指定的前缀。