如何配置vite的proxy

1.前言

vite项目,本地开发环境可以通过配置proxy代理实现跨域请求。但是生产环境,该配置不生效,一般使用 nginx 转发,或者后端配置cors

2.解释

javascript 复制代码
server: {
      port: 9000,
      proxy: { // 本地开发环境通过代理实现跨域,生产环境使用 nginx 转发
        // 正则表达式写法
        '^/api': {
          target: 'http://xxxx/xx'// 后端服务实际地址
          changeOrigin: true, //开启代理
// path是请求方法axios配置的baseUr中去除 协议+域名+端口 剩下的部分。例如http://127.0.0.1:9000/api,这里的path就是/api
          rewrite: (path) => path.replace(/^\/api/, '') // 路径重写
        }
      }
    }

注意:最终的请求地址是 target + (rewrite重写的地址

3.图解:


相关推荐
上海云盾-小余5 分钟前
DDoS 攻击应急响应全流程:从告警触发到业务恢复的黄金 15 分钟
服务器·安全·游戏·ddos
LXY_BUAA9 分钟前
《ubuntu22.04》_新系统的配置_20260418
linux·运维·服务器
上海云盾-小余10 分钟前
API 接口 DDoS 与 CC 攻击防护实战:守住业务最脆弱的数字入口
服务器·ddos
楼田莉子14 分钟前
同步/异步日志系统:日志落地模块\日志器模块\异步日志模块
linux·服务器·c++·学习·设计模式
comerzhang65519 分钟前
Web 性能的架构边界:跨线程信令通道的确定性分析
javascript·webassembly
Hooray23 分钟前
为了在 Vue 项目里用上想要的 React 组件,我写了这个 skill
前端·ai编程
咸鱼翻身了么25 分钟前
模仿ai数据流 开箱即用
前端
风花雪月_25 分钟前
🔥IntersectionObserver:前端性能优化的“隐形监工”
前端
Bigger25 分钟前
告别 AI 塑料感:我是如何用 frontend-design skill 重塑项目官网的
前端·ai编程·trae
发际线向北25 分钟前
0x02 Android DI 框架解析之Hilt
前端