React使用代理解决跨域问题

这次又遇到跨域问题,大佬推荐我用跨域代理来解决
本文仅限使用creat-react-app来创建的项目
参考文档:https://facebook.github.io/create-react-app/docs/proxying-api-requests-in-development#docsNav

1.解决跨域的方法

文档中提到

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
    }
  }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容