|
阅读：7992回复：2
react 设置代理(proxy) 实现跨域请求
一，对于使用creat-react-app构建的项目，可以直接在package.json下配置，具体如下
"proxy": "http://api.xxxx.com" 或者如果创建多个域，该如何设置proxy,能满足可以调用不同域下的API的需求？代码如下 //package.json中加入 "proxy": {
"/api/RoomApi": {
"target": "http://open.douyucdn.cn",
"changeOrigin":true
},
"/api/v1":{
"target":"http://capi.douyucdn.cn",
"changeOrigin":true
}
}使用注意事项： create-react-app脚手架低于2.0版本时候，可以使用对象类型 "proxy":{
"/api/**":{
"target":"http://m.kugo.com",
"changeOrigin": true
}
}最新的create-react-app脚手架2.0版本以上只能配置string类型 "proxy": "http://m.kugo.com", 最好的方式可以通过middleware中间件进行配置（可以配置多个代理） 先安装下，install http-proxy-middleware const proxy = require("http-proxy-middleware");
module.exports = function(app) {
app.use(
proxy("/api/**", {
target: "http://m.kugo.com/json=true",//跨域地址
changeOrigin: true
})
);
};二，对于antd-pro的项目，需要在package.json的同等目录下添加.roadhogrc文件，具体代码: {
"entry": "src/index.js",
"extraBabelPlugins": [
"transform-runtime",
"transform-decorators-legacy",
"transform-class-properties",
["import", { "libraryName": "antd", "libraryDirectory": "es", "style": true }]
],
"env": {
"development": {
"extraBabelPlugins": [
"dva-hmr"
]
}
},
"externals": {
"g2": "G2",
"g-cloud": "Cloud",
"g2-plugin-slider": "G2.Plugin.slider"
},
"ignoreMomentLocale": true,
"theme": "./src/theme.js",
"proxy": {
"/api": {
"target": "http://api.xxxx.com/",
"changeOrigin": true
}
}
}参考: https://blog.csdn.net/weixin_33768481/article/details/93702514https://www.cnblogs.com/theblogs/p/10394496.html |
|
|
|
沙发#
发布于：2021-04-20 16:04
create-react-app脚手架2.0版本,使用http-proxy-middleware中间件，配置多个代理的方法
1. src目录下创建一个 setupProxy.js文件 const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function (app) {
app.use(
'/api',
createProxyMiddleware({
target: 'https://eyesight.news.qq.com/',
changeOrigin: true,
pathRewrite: {
'^/api': '',
}
})
);
app.use(
'/apc',
createProxyMiddleware({
target: 'https://api.inews.qq.com/',
changeOrigin: true,
pathRewrite: {
'^/apc': '',
}
})
);
};注意：一定要写pathRewrite，不写没有效果 参考： https://rourou.blog.csdn.net/article/details/107258487 |
|
|
|
板凳#
发布于：2021-03-17 16:25
用户被禁言,该主题自动屏蔽! |
|
