vite中server.proxy的一些配置

文章讲述了如何在Vite或Vue-cli的配置中设置代理,将以/api开头的接口请求从本地服务器重定向到指定的目标地址(如http://localhost:8081),通过changeOrigin支持跨域,并利用PathRewrite规则移除请求路径中的/api前缀。
摘要由CSDN通过智能技术生成
  • target是目标代理的接口地址,当监测到以 /api开头的接口后,把axios请求中前面的本地服务器地址改为target的值,实际发送给后端的请求就是下方后一个请求

         http://XX.XX.XX.XX:8080/api/def --> http://localhost:8081/api/def

  • changeOrigin表示是否跨域

  • PathRewrite:替换请求中匹配的内容,在这里就是去掉 /api 前面的 ^

server:{
    proxy:{
      '/api':{
        target:"http://localhost:8081",  //目标代理接口地址
        secure:false,
        changeOrigin:true,  //开启代理,在本地创建一个虚拟服务器
        PathRewrite:{
          '^/api':'/api'
        }
      }
    }
}

vite配置的server.proxy其实和vue-cli配置的devServer.proxy大致一样

附上vite官网的server.proxy链接:

https://cn.vitejs.dev/config/server-options.html#server-proxy

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值