今天在开发中,遇到一个需求,因为后台服务是我自己这边启动的。所以后台服务地址和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 } } }
复制