webpack代理请求api,解决跨域问题。
2017-12-29 本文已影响0人
hansduo
前些时间学习react过程中,碰到一个情况。
请求测试环境的api,因为跨域,在跑项目时报错。
最初想法是nginx代理服务器地址和webpack地址,结果因为不清楚的原因(技术深度不够)。这个方法没能生效。
之后就了解到了,webpack可以直接进行代理。将服务器api代理到webpcak同一个ip和端口下。
暂时解决了本地开发的问题。
devServer: {
contentBase: './src/',
historyApiFallback: true,
hot: true,
port: defaultSettings.port,
publicPath: defaultSettings.publicPath,
noInfo: false,
proxy: {
'/api': {
target: 'http://localhost:8085/',
pathRewrite: {'^/api' : '/seckill'},
changeOrigin: true
}
}
},
主要是proxy内的设置。
后台api完整地址:http://localhost:8085/seckill/time/now
通过代理设置,在react内请求:http://localhost:8000/api/time/now 即是请求上面的接口。
(webpack端口 8000)
记录以备忘