方法一：
在package.json中追如下配置
"proxy":"http://localhost:5000"
說明：
1、優(yōu)點(diǎn)：配置簡單，前端請求資源可以不加任何前綴
2、缺點(diǎn)：不能配置多個(gè)代理
3、工作方式：上述方式配置代理，當(dāng)請求了3000不存在的資源時(shí)慧妄，那么該請求會(huì)轉(zhuǎn)發(fā)給5000（優(yōu)先匹配前端資源）
方法二：
1、第一步：安裝依賴 http-proxy-middleware(要注意版本號哦??)
npm install http-proxy-middleware
2剪芍、第二步：創(chuàng)建代理配置文件
在src下創(chuàng)建配置文件：src/setupProxy.js
2塞淹、編寫setupProxy.js配置具體代理規(guī)則：
// 一定要注意「http-proxy-middleware」的版本號，否則會(huì)導(dǎo)致項(xiàng)目啟動(dòng)失敗
const proxy = require('http-proxy-middleware')
module.exports = function(app){
app.use(
// http-proxy-middleware 版本2.x.x一下
proxy('/api1',{
target:'http:localhost:5000',
changeOrigin:true,
pathRewrite:{'^/api1':''}
}),
// http-proxy-middleware 版本2.x.x及以上
proxy.createProxyMiddleware('/api2',{
target:'http:localhost:5001',
changeOrigin:true,
pathRewrite:{'^/api2':''}
}),
)
}
服務(wù)器接口地址：http:localhost:5000/students
前端請求地址：http:localhost:3000/api1/students
服務(wù)器接口地址：http:localhost:5001/cars
前端請求地址：http:localhost:3000/api2/cars
說明：
1罪裹、優(yōu)點(diǎn)：可以配置多個(gè)代理饱普，可以靈活的控制請求是否走代理
2、缺點(diǎn)：配置繁瑣状共，前端請求資源時(shí)必須加前綴
image.png
