react 配置代理 setupProxy.js导致无法连接localhost

低版本

javascript 复制代码
const proxy = require('http-proxy-middleware')
   
   module.exports = function(app) {
     app.use(
       proxy('/api1', {                         //api1是需要转发的请求(所有带有/api1前缀的请求都会转发给5000)
         target: 'http://localhost:5000',        //配置转发目标地址(能返回数据的服务器地址)
         changeOrigin: true,                  //控制服务器接收到的请求头中host字段的值
         pathRewrite: {'^/api1': ''}         //去除请求前缀,保证交给后台服务器的是正常请求地址(必须配置)
       }) 
     )
   }

换成高版本

javascript 复制代码
const { createProxyMiddleware } = require("http-proxy-middleware")
module.exports = function (app) {
  app.use(
    createProxyMiddleware("/api1",{
      target: "http://localhost:5000", //配置转发目标地址(能返回数据的服务器地址)
      changeOrigin: true, //控制服务器接收到的请求头中host字段的值
      pathRewrite: { "^/api1": "" }, 
    }),
    createProxyMiddleware("/api2",{
      target: "http://localhost:5001", //配置转发目标地址(能返回数据的服务器地址)
      changeOrigin: true, //控制服务器接收到的请求头中host字段的值
      pathRewrite: { "^/api2": "" }, 
    })
  )
}

问题即可解决。

勾八玩意,浪费时间。

相关推荐
烛阴15 分钟前
解锁 TypeScript 的元编程魔法:从 `extends` 到 `infer` 的条件类型之旅
前端·javascript·typescript
前端开发爱好者40 分钟前
弃用 ESLint + Prettier!快 35 倍的 AI 格式化神器!
前端·javascript·vue.js
wayhome在哪44 分钟前
Cropper.js 轻松拿捏前端裁剪🤞
javascript·canvas·设计
&白帝&1 小时前
vue2和vue3的对比
javascript·vue.js·ecmascript
江东大都督周总1 小时前
rabbitmq集群
javascript·rabbitmq·ruby
vivi_and_qiao1 小时前
HTML的form表单
java·前端·html
一嘴一个橘子1 小时前
uniapp 顶部tab + 占满剩余高度的内容区域swiper
javascript·uni-app
wayhome在哪1 小时前
30KB 轻量王者!SortableJS 轻松搞定拖拽需求
javascript·设计·dom
骑驴看星星a2 小时前
Vue中的scoped属性
前端·javascript·vue.js
四月_h2 小时前
在 Vue 3 + TypeScript 项目中实现主题切换功能
前端·vue.js·typescript