Vue代理配置重写方法(pathRewrite与rewrite)

今天在开发中,遇到一个需求,因为后台服务是我自己这边启动的。所以后台服务地址和Tomcat启动的网页地址是一样的,导致我们vue代理的时候,直接跳转到我们Tomcat启动的旧页面当中,写入/api便不会跳到tomcat页面,但如此便会导致与接口地址不符

所以需要用路由重写方法来重写。

如下图,rewirte来重写我们请求接口的路由,请求时自动会把/api给去除掉。

Vue3重写写法(Vite环境下)在Vite.config.js中配置

Vue3(Vue.config.js)

devServer: {
        proxy: {
            //代理匹配前缀2
            '/api2': {
                target: 'http://localhost:5001',
                pathRewrite: {'^/api2': ''},
                ws: true,
                changeOrigin: true
            },
			//代理匹配前缀1
            '/api': {
                target: 'http://localhost:5000',
                pathRewrite: {'^/api': ''},
                ws: true,)
                changeOrigin: true
            }
        }
    }

  • 3
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值