vite中配置vue3代理请求

在使用Vite构建Vue 3项目时，如果你需要进行代理请求，以解决开发环境中的跨域问题，可以通过配置`vite.config.js`文件来实现。Vite默认支持使用`http-proxy-middleware`作为代理中间件。

以下是一个基本的配置示例：

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import { createProxyMiddleware } from 'http-proxy-middleware';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  server: {
    proxy: {
      '/api': {
        target: 'http://backend.example.com', // 你的后端服务地址
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ''), // 如果你的后端不使用/api作为路径前缀，则需要配置此项
      },
    },
  },
});

在上述配置中，我们定义了`/api`的代理规则，这意味着所有以`/api`开头的请求都会被代理到`http://backend.example.com`。`changeOrigin`设置为`true`是为了修改HTTP头中的`origin`字段，使其看起来请求是从代理服务器发起的，这对于某些后端安全策略是必要的。`rewrite`函数用于修改请求路径，确保请求路径与后端服务的实际路径匹配。