vuetify项目添加代理跨域请求
vuetify项目添加代理转发后端接口实现跨域请求
- 配置一（推荐）
- 配置二
在项目根目录下找到vite.config.mts文件并在里面的server下配置代理，
具体实现代码如下：
配置一（推荐）
server: {port: 3000,// 配置代理proxy: {'/api': {target: 'http://localhost:8080',changeOrigin: true, // 允许跨域,修改 Origin 头匹配目标服务器rewrite: (path) => path.replace(/^\/api/, '/api'), // 移除请求路径中的/api前缀 (如果后端路由是 /api/login，则 replace 应保持 ^/api, '/api';如果后端路由是 /login，则改为 ^/api, '')logLevel: 'debug', // 打印请求日志secure: false, // 接受运行在 HTTPS 上的服务ws: true, // 启用 WebSocket 代理}}}
配置二
server: {port: 3000,// 配置代理proxy: {'/api': {target: 'http://localhost:8080',changeOrigin: true, // 允许跨域,修改 Origin 头匹配目标服务器pathRewrite: {'^/api': '/api' // 移除请求路径中的/api前缀 (如果后端路由是 /api/login，则 pathRewrite 应保持 ^/api → /api;如果后端路由是 /login，则改为 ^/api: '')},logLevel: 'debug', // 打印请求日志secure: false, // 接受运行在 HTTPS 上的服务ws: true, // 启用 WebSocket 代理}}}