webpack开发跨域问题解决办法
本文介绍了webpack开发跨域问题解决办法，分享给大家，具体如下：
1.说明
webpack内置了http-proxy-middleware可以解决请求的URL代理的问题
2.API
需要代理的pathname要加/
module.exports={
devtool:'cheap-module-source-map',
entry:'./app/js/index.js'
output:{
path:path.resolve(__dirname,'dev'),
//所有输出文件的目标路径
filename:'js/bundle.js',
publicPath:'/',
chunkFilename:'[name].chunk.js'
},
devServer:{
contentBase:path.resolve(__dirname,'dev'),
publicPath:'/',
historyApiFallback:true,
proxy:{
//请求到'/device'下的请求都会被代理到target：http://debug.xxx.com中
'/device/*':{
target:'http://debug.xxx.com',
secure:false,//接受运行在https上的服务
changeOrigin:true
}
}
}
}
3.使用
注：使用的url必须以/开始否则不会代理到指定地址
fetch('/device/space').then(res=>{
//被代理到http://debug.xxx.com/device/space
returnres.json();
}).then(res=>{
console.log(res);
})
fetch('device/space').then(res=>{
//http://localhost:8080/device/space访问本地服务
returnres.json();
}).then(res=>{
console.log(res);
})
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。