react proxy 報錯

react項目中，package.json中proxy的配置如下

 "proxy": {
    "/api/rjwl": {
      "target": "http://47.94.142.215:8081",
      "changeOrigin": true
    }
  }

就會報這樣的錯誤

When specified, "proxy" in package.json must be a string.
Instead, the type of "proxy" was "object".
Either remove "proxy" from package.json, or make it a string.

 

原因：

原來React新版本不支持那樣設置反向代理了

解決方案

安裝 http-proxy-middleware

$ npm install http-proxy-middleware --save
$ # or
$ yarn add http-proxy-middleware

然后

在創建一個setupProxy.js文件，在src目錄，src/setupProxy.js

const proxy = require('http-proxy-middleware')

module.exports = function (app) {
  app.use(proxy('/rjwl', {
    target: 'http://47.94.142.215:8081',
    secure: false,
    changeOrigin: true,
    pathRewrite: {
      "^/rjwl": "/rjwl"
    }
  }))
}

如果請求站點為https，

則需要加上這個"changeOrigin":true

否則則會報錯

 

參考地址：

https://www.blyoo.com/4007.html

項目

https://github.com/besswang/rj_cash_admin