react设置代理

1.创建一个setupProxy.js文件(文件名不能改)

2.在文件中写入一下内容

复制代码
// 配置代理---在新版本中将createProxyMiddleware需要解析出来
const {createProxyMiddleware } =require('http-proxy-middleware')

module.exports=function(app){
    app.use(
        // 第一个代理  遇见api1前缀的请求,就会触发该代理配置
        createProxyMiddleware ('/api1',{
            // 请求转发给谁
            target:'http://localhost:3000',
            changeOrigin:true,//控制服务器收到的请求头中HOST字段的值
            // 将api1变为空
            pathRewrite:{'^api1':''}//重写请求路径
        }),
        // 第二个代理
        createProxyMiddleware ('/api2',{
            target:'http://localhost:3001',
            changeOrigin:true,
            // 将api1变为空
            pathRewrite:{'^api2':''}
        }),
    )
}

3.使用

使用的时候很简单了

import axios from 'axios'

axios.get('/api1/search/user').then((res)=>{

}).catch((err)=>{

console.log(err)

})

相关推荐
Hilaku1 分钟前
为什么 AI 写前端时,总是优先选择 React,而不是 Vue?
前端·javascript·程序员
京东云开发者3 分钟前
GPT-5.6、ChatGPT Work 与 Codex 更新食用指南
前端
Cao_Ron14 分钟前
用 ECharts graph 画出卡片式矩形节点
前端
skiyee23 分钟前
换个底座的 Wot Starter 居然让 AI 更懂项目!
前端·ai编程
anyup29 分钟前
这一套绝了!AI 大模型写故事,星云 SDK 驱动 3D 数字人实时演绎
前端·人工智能·aigc
耀耀切克闹灬1 小时前
短链跳转
前端
孟陬1 小时前
高质量全方位的 AI 工具 sse-stuntman — Mock SSE 接口
前端·node.js·openai
Cao_Ron1 小时前
给 ECharts 6 graph 节点叠加角标:从原理到性能优化
前端
WebGirl1 小时前
内网穿透方式
前端
hoLzwEge2 小时前
前端项目的基石:深入解读 package.json 的作用与核心配置
前端·前端框架