React（4.5）跨域代理

跨域代理

浏览器端因为同源策略，存在跨域问题。一般开发过程中，使用proxy代理方式解决。

需要安装一个代理插件 http-proxy-middleware

①在项目包根路径安装代理插件

npm i http-proxy-middleware

安装之后在项目包的package.json中查看依赖，是否安装成功

 ②建立配置文件

配置文件修改后，注意重启项目服务

/src/setupProxy.js

// /src/setupProxy.js 路径和文件名注意写对

const {createProxyMiddleware} = require('http-proxy-middleware');

module.exports = function(app){
  // 插件使用
  // 如果有多个域名需要配置跨域  使用多个app.use()
  app.use(
    // 配置代理相关信息
    createProxyMiddleware("/douyu",{
      target:"https://m.douyu.com",
      changeOrigin:true,
      secure:true,
      pathRewrite:{
        "^/douyu":""
      }
    })
  )
}