在网上找了很多都是webpack在config目录下的index.js里面代码,这里总结了一个webpack-simple跨域的问题,在webpack.config.js的devServer中配置:
devServer:{
port: 8080,//自己项目的端口
host: 'localhost',//自己项目的地址(注意:这里不要加http协议)
proxy: {
'/api/*': {//匹配根路径
target: 'http://192.168.x.xxx:xxxx',//跨域要访问的地址及端口
changeOrigin: true,
secure: false,
}
}
}
如果用的事axios访问后台的话,倘若同时请求多个接口,也会出现代理失败的问题,这里分享一个解决方法:
axios.all([
axios.post('/user1'),
axios.post('/user2'),
axios.post('/user3')
])
.then(axios.spread(function (cpResp, cgResp, pdResp) {
//回调
}));
同时,后台配置(java写法)
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("content-type", "text/html; charset=UTF-8");
注意:
- '/api/*'表示 ‘/api’ 请求都会被代理到 target: http://192.168.x.xxx:xxxx 中,如:localhost:8080/api/test会被代理到:http://192.168.x.xxx:xxxx/api/test;
- target里面一定要把http带上,我就是没带http然后搞了大半天!
- 如果有其他的方法大家可以留言交流。