react单独配置代理

首先在src文件下创建setupProxy.js文件，和App.js同一级，例如：

const { createProxyMiddleware } = require('http-proxy-middleware');
//更新后使用的是createProxyMiddleware，以前使用的是proxy
module.exports = function(app){
    app.use(
        createProxyMiddleware('/api1',{ //遇见/api1前缀的请求，就会触发该代理配置
            target:'http://localhost:5000', //请求转发给谁
            changeOrigin:true,//控制服务器收到的请求头中Host的值
            pathRewrite:{'^/api1':''} //重写请求路径(必须)
        })
    ),
    app.use(
        createProxyMiddleware('/api2',{ //遇见/api2前缀的请求，就会触发该代理配置
            target:'http://localhost:5000', //请求转发给谁
            changeOrigin:true,//控制服务器收到的请求头中Host的值
            pathRewrite:{'^/api1':''} //重写请求路径(必须)
        })
    )
    //.....可以定义多个不同的代理 
}

使用的时候，例如：

 1 search = ()=>{
 2         //获取用户的输入(连续解构赋值+重命名) {value:keyWord} keyWord就是value的别名
 3         const {keyWordElement:{value:keyWord}} = this
 4         //发送请求前通知App更新状态
 5         this.props.updateAppState({isFirst:false,isLoading:true})
 6         //发送网络请求
 7         axios.get(`/api1/search/users?q=${keyWord}`).then(
 8             response => {
 9                 // console.log(response.data.items)
10                 this.props.updateAppState({isLoading:false,users:response.data.items})
11             },
12             error => {
13                 //请求失败后通知App更新状态
14                 this.props.updateAppState({isLoading:false,err:error.message})
15             }
16         )
17     }

不停学习,热爱是源源不断的动力。