Vite配置Proxy代理解决跨域问题

JC.AI

于 2024-09-18 09:32:55 发布

阅读量240

点赞数 3

文章标签： vue.js 前端

本文链接：https://blog.csdn.net/weixin_48819809/article/details/142324696

版权

在vite.config.ts中进行如下配置

server: {
  // http://localhost:5173/api/login -> http://www.test.com/login
  proxy: {
    //api是自行设置的请求前缀，任何请求路径以/api开头的请求将被代理到对应的target目标
    '/api': {
      target: http://www.test.com, //目标域名
      changeOrigin: true, //需要代理跨域
      rewrite: (path) => path.replace(/^\/api/, ''), //路径重写，把'/api'替换为''
    },
  },
},

配置代理后，会把当前请求http://localhost:5173/api/login代理到target中的地址http://www.test.com/api/login，并且通过路径重写，最终转发到http://www.test.com/login真实后端服务器，解决跨域问题。