这次又遇到跨域问题,大佬推荐我用跨域代理来解决
本文仅限使用creat-react-app来创建的项目
参考文档:https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#proxying-api-requests-in-development
1.解决跨域的方法
文档中提到
- 自己配置跨域代理
- 在服务端配置跨域 (here’s how to do it for Express).
- 使用环境变量来向你的应用中注入正确的服务器域名和端口
2.跨域代理解决
在package.json中
假如这句话即可
"proxy":"http://localhost:8080"
如下图
图片.png
3.请求
请求的时候,就不用带域名了
例如,这样即可
图片.png
4.进一步设置
修改 proxy 的配置,以后开发环境请求如果以 /api
前缀,才会走代理,比如 fetch('/api/foobar'),会自动变成 'http://localhost:8080/foobar'
"proxy": {
"/api": {
"target": "http://localhost:8080",
"pathRewrite": {
"^/api" : ""
},
"changeOrigin": true
}
}
网友评论