在项目中遇到了跨域问题,网上搜索了各种方法都没有成功
代码:
首先后台的接口是这样的 http://47.96.29.50:8080/api/v1/discAerator/list
于是配置了baseURL:
axios.defaults.baseURL = 'http://47.96.29.50:8080/api/v1';
然后按照网上配置了vue.config.js如下:
module.exports = {
devServer: {
open: true,
port: 8080,
proxy: {
'/api': {
target: `http://47.96.29.50:8080`,
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
},
}
}
}
页面请求:
axios.get({ url: "/discAerator/list" }).then(res => {
console.log(res);
});
然后页面报错:
经过一番思索,将config配置中目标路径修改为:
proxy: {
'/api': {
target: `http://47.96.29.50:8080/api/v1`,
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
然后baseURL修改:
axios.defaults.baseURL = '/api';
页面请求不变,此时再重启项目,跨域请求成功!
我是一个一年经验的前端开发小白,这次只是记录自己解决了问题,但是我的方法也不一定就能够解决你的问题。希望大家不要盲目复制,还是要自己多尝试解决。
这里祝大家进步飞快!