proxy配置代理,配置多个代理小结
1、路径中含有'/dev-api/admin/product'都会匹配到第一个代理,需要注意的是如果把第二个代理放到最上面那么所有请求会被匹配到其target路径下
2、实际路径是:target+ baseURL(如果重写axios文件配置)+url(api文件) - pathRewrite
实际请求:
1、http://39.98.123.211:8170/admin/acl/index/login
2、http://39.98.123.211:8216/admin/product/baseTrademark/1/10
配置后实际路径: target+baseURL+url(api.js) - pathRewrite (重写路径) == > http://39.98.123.211:8216/dev-api/admin/product/baseTrademark/1/10 =》将路径中 /dev-api变为空
====> http://39.98.123.211:8216/admin/product/baseTrademark/1/10
request.js
import axios from 'axios' import { MessageBox, Message } from 'element-ui' import store from '@/store' import { getToken } from '@/utils/auth' // create an axios instance const service = axios.create({ baseURL: "/dev-api",
timeout: 5000
})
vue.config.js
proxy: {
'/dev-api/admin/product': {
target: 'http://39.98.123.211:8216',
pathRewrite: { '^/dev-api': '' },
ws: true, //用于支持websocket
changeOrigin: true, // 用于控制请求头的host值
secure: false, //http为false ,https为true
},
'/dev-api': {
target: 'http://39.98.123.211:8170',
pathRewrite: { '^/dev-api': '' },
},
},
api.js
import request from '@/utils/request'
export function login(data) {
return request({
url: '/admin/acl/index/login',
method: 'post',
data
})
}
export const tradeMarkList = (page,limit) => request({
url: `/admin/product/baseTrademark/${page}/${limit}`,
method: 'get',
})