在此之前, 请求的服务器需要后端设置可跨域
此文章中主要有两种方案:
const apis = {
api1: 'http://aaa.com/',
api2: 'http://bbb.com/'
}
(1) 把baseURL置空不设置, 定义一个新的axios
const service = axios.create({
timeout: 300000, // 5分钟
})
把完整的url链接放入到请求中
export const get1 = (url: string, params = {}, token = true) => {
let u = apis.api1 + url
return service.get(u, { params }).then((res) => res.data)
};
export const get2 = (url: string, params = {}, token = true) => {
let u = apis.api2 + url
return service.get(u, { params }).then((res) => res.data)
};
(2)和后端约定, 不同项目的接口, 请求的接口头部不同. 因为一般的都为’/api’, 可约定’/program1/api’、‘/program2/api’, 此时就可以不用区分请求接口方法(主要区分在代理使用)
代理代码:
proxy: {
'/program1': {
target: apis.api1,
changeOrigin: true,//设置访问目标地址允许跨域
rewrite: (p) =>{ return p.replace(/^\/program1/, '')}
},
'/program2': {
target: apis.api2,
changeOrigin: true,//设置访问目标地址允许跨域
rewrite: (p) =>{ return p.replace(/^\/program2/, '')}
},
}