When specified, “proxy” in package.json must be a string 关于React 中使用 axios 跨域问题

刚安装好react脚手架，然后用axios来请求发现存在跨域问题，我请求的是https的好像请求http是没有跨域问题，就去百度搜索了一下资料，在网上看到是这样配置代理的，在package.json里添加如下代码

"proxy": {
        "/*": {
            "target": "https://dev.xiao.com/api/goco/portal",
            "changeOrigin": true
        }
    }

但是启动项目却报错了如下图

报错图片

以为我哪里写错的了，一个一个字对比没发现在有错呀！于是我就下定决心要把这问题处理好就在网上搜了下错误代码
，在Facebook官方github里看到了原来React新版本不支持那样设置反向代理了

新版本需要这样做

安装http-proxy-middleware

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

再创建一个setupProxy.js文件，在src目录，src/setupProxy.js

例如之前的配置

"proxy": {
        "/*": {
            "target": "https://dev.xiao.com/api/goco/portal",
            "changeOrigin": true
        }
    }

setupProxy.js文件里则这样写

const proxy = require('http-proxy-middleware')
 
module.exports = function(app) {
  app.use(proxy('/api', { target: 'https://dev.xiao.com/api/goco/portal' }))
}

比较完整写法 ,请求的时候记得加上api

app.use(proxy('/api', { 
target: 'https://dev.xiao.com/api/goco/portal',
changeOrigin:true,
pathRewrite: {
            "^/api": "/"
        }
 }))

如果想偷懒直接在package.json里添加如下代码
"proxy": "https://dev.xiaomon.com/api/goco/portal"

如果你还没更多的问题可以到Facebook官方github看https://github.com/facebook/create-react-app/issues/5103