美文网首页
React使用代理解决跨域问题

React使用代理解决跨域问题

作者: ZZES_ZCDC | 来源:发表于2017-11-23 13:34 被阅读6035次

    这次又遇到跨域问题,大佬推荐我用跨域代理来解决
    本文仅限使用creat-react-app来创建的项目
    参考文档:https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#proxying-api-requests-in-development

    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
        }
      }
    

    相关文章

      网友评论

          本文标题:React使用代理解决跨域问题

          本文链接:https://www.haomeiwen.com/subject/wlrzvxtx.html