方法一：配置 package.json 文件

不能配置多个代理，只能配置单个代理
当请求了当前项目不存在的资源时，那么该请求会转发给5000（优先匹配当前项目资源）

打开 package.json 文件，进行配置
"proxy":"http://localhost:5000"

使用方法

import React, { Component } from 'react'
import axios from 'axios'

export default class App extends Component {
    getData1 = () => {
        // 会指向配置中的 http://localhost:5000 调用 /search/data1 接口地址
        axios.get("http://localhost:3000/search/data1").then(res => {
            console.log(res)
        })
    }
    render() {
        return (
            <div>
                <button onClick={this.getData1}>获取数据1</button>
            </div >
        )
    }
}

方法二：创建 setupProxy.js 文件进行配置（推荐）

可以配置多个代理，可以灵活的控制请求是否走代理。
请求接口的时候必须加上所配置的前缀。

在src文件夹下创建配置文件：setupProxy.js，创建的配置文件名不可自定义

配置 setupProxy.js 文件

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

module.exports = function (app) {
    app.use(
        /**第一个请求配置 */
        createProxyMiddleware('/api1', {	//需要转发的请求（当请求中有api1前缀的请求，会触发该代理配置）
            target: "http://localhost:5000",//配置转发目标地址(能返回数据的服务器地址)
            changeOrigin: true,//控制服务器收到的请求头中host的值
            /*
	         	changeOrigin设置为true时，服务器收到的请求头中的host为：localhost:5000
	         	changeOrigin设置为false时，服务器收到的请求头中的host为：localhost:3000
	         	changeOrigin默认值为false，但我们一般将changeOrigin值设为true
	         */
            pathRewrite: { '^/api1': '' }//重写请求路径，去除请求前缀，保证交给后台服务器的是正常请求地址(必须配置)
        }),
        /**第二个请求配置 */
        createProxyMiddleware('/api2', {//需要转发的请求（当请求中有api2前缀的请求，会触发该代理配置）
            target: "http://localhost:5002",//配置转发目标地址(能返回数据的服务器地址)
            changeOrigin: true,//控制服务器收到的请求头中host的值
            /*
	         	changeOrigin设置为true时，服务器收到的请求头中的host为：localhost:5000
	         	changeOrigin设置为false时，服务器收到的请求头中的host为：localhost:3000
	         	changeOrigin默认值为false，但我们一般将changeOrigin值设为true
	         */
            pathRewrite: { '^/api2': '' }//重写请求路径，去除请求前缀，保证交给后台服务器的是正常请求地址(必须配置)
        })
        /** 更多请求配置... */
    )
}

使用方法

import React, { Component } from 'react'
import axios from 'axios'

export default class App extends Component {
    getData1 = () => {
        // 使用 代理1 调用 /search/data1 接口获取数据
        axios.get("/api1/search/data1").then(res => {
            console.log(res)
        })
    }
    getData2 = () => {
        //  使用 代理2 调用 /search/data2 接口获取数据
        axios.get("/api2/search/data2").then(res => {
            console.log(res)
        })
    }
    render() {
        return (
            <div>
                <button onClick={this.getData1}>获取数据1</button>
                <button onClick={this.getData2}>获取数据2</button>
            </div >
        )
    }
}