react项目代理配置

简介: react项目代理配置

1.在src文件下创建setupProxy.js,切记必须是这文件名,否则不会被识别

2.直接把代码v上去,const proxy = require("http-proxy-middleware");一定要先引入一下,这是react脚手架已经安装上的,直接引入就行

const proxy = require("http-proxy-middleware"); //引入http-proxy-middleware,react脚手架已经安装
module.exports = function (app) {
  app.use(
    proxy.createProxyMiddleware("/webapi", {
      //遇见/api1前缀的请求,就会触发该代理配置
      target: "https:....../webapi", //请求转发给谁
      changeOrigin: true, //控制服务器收到的请求头中Host的值
      pathRewrite: { "^/webapi": "" }, //重写请求路径,下面有示例解释
    })
  );
};

3.接口请求:webapi/......

相关文章
|
2月前
|
前端开发
react配置proxy代理的两种方式
本文介绍了在React项目中配置代理的两种方式:通过在package.json中添加代理配置,以及通过创建setupProxy.js文件来实现更复杂的代理规则。
121 2
|
3月前
|
存储 监控 前端开发
|
3月前
|
移动开发 前端开发 安全
React Native环境搭建及配置问题
React Native环境搭建及配置问题
86 2
|
4月前
|
Web App开发 JavaScript 前端开发
react18【系列实用教程】搭建开发环境(2024版)Vite+React (官方推荐)(含@配置,react-developer-tools 和 Redux DevTools 下载安装)
react18【系列实用教程】搭建开发环境(2024版)Vite+React (官方推荐)(含@配置,react-developer-tools 和 Redux DevTools 下载安装)
282 0
|
6月前
|
前端开发 数据可视化 API
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(二)
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏
420 0
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(二)
|
6月前
|
前端开发 Android开发 iOS开发
应用研发平台EMAS使用 aliyun-react-native-push 库接入推送和辅助通道,推送都可以收到,但是在App切到后台或者杀掉进程之后就收不到推送了,是需要配置什么吗?
【2月更文挑战第31天】应用研发平台EMAS使用 aliyun-react-native-push 库接入推送和辅助通道,推送都可以收到,但是在App切到后台或者杀掉进程之后就收不到推送了,是需要配置什么吗?
123 2
|
6月前
|
前端开发 JavaScript CDN
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(一)
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏
221 0
|
6月前
|
运维 JavaScript 前端开发
发现了一款宝藏学习项目,包含了Web全栈的知识体系,JS、Vue、React知识就靠它了!
发现了一款宝藏学习项目,包含了Web全栈的知识体系,JS、Vue、React知识就靠它了!
101 2
|
6月前
|
设计模式 前端开发 数据可视化
【第4期】一文了解React UI 组件库
【第4期】一文了解React UI 组件库
362 0
下一篇
无影云桌面