vite.config.ts中proxy的rewrite理解

服务器配置都是在开发情况下适用!!

javascript 复制代码
// 服务器配置
server: {
  //允许IP访问
  host: "0.0.0.0",
  //应用端口(默认:3000)
  port: Number(env.VITE_APP_PORT),
  // 运行是否自动打开浏览器
  open: true,
  // 代理配置
  proxy: {
  	//   '/dev-api'
    [env.VITE_APP_BASE_API]: {
      changeOrigin: true,
      // 接口地址
      target: env.VITE_APP_API_URL,// http://localhost:8990
      rewrite: (path) =>
        path.replace(new RegExp("^" + env.VITE_APP_BASE_API), ""),
      //rewrite: (path) => path.replace(/^\/dev-api/, '')
    },
  },
},

项目中请求接口为:'/api/queryData', 后端服务为:http://localhost:8990

①.不加rewrite: (path) => path.replace(/^/dev-api/, '')

后端接受到接口为http://localhost:8990/dev-api/queryData

额外多一个前缀'/dev-api'

②.加上rewrite: (path) => path.replace(/^/dev-api/, '')

后端接受到接口为http://localhost:8990/queryData

无前缀'/dev-api'

参考:https://blog.csdn.net/lsk222/article/details/137279250

相关推荐
A242073493013 小时前
Vue3 + TypeScript:后端数据在表格内渲染后进行增删改的完整实现步骤
前端·javascript·typescript
水獭比特13 小时前
AI 视频生成不是一次 HTTP 请求:先把长任务状态机补齐
人工智能·typescript
弹简特15 小时前
【Vue3速成】06-vue3官方库路由机制之Pinia状态管理
vue·pinia
java1234_小锋1 天前
Vue3专题 - 响应式基础
vue·vue3·响应式
kyriewen1 天前
别再这样写TypeScript了——Code Review中最常见的8个反模式
前端·javascript·typescript
Wiktok1 天前
Vue3(Vite)打包安卓APP 完整最佳实践
android·vue
A24207349302 天前
Vue 3 + TypeScript:核心优势与开发注意事项详解
vue.js·ubuntu·typescript
sugar__salt2 天前
Vue3 自定义指令与插槽(Slot)技术详解
前端·javascript·vue.js·前端框架·vue
用户0934077735142 天前
HarmonyOS WPS Open SDK 实践:enableEdit 怎么映射预览与编辑
typescript
鱼饼Y2 天前
AI时代,使用大模型学习LangChain (4)——LangGraph
typescript·langchain