如何配置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.图解:


相关推荐
用户80806181436933 分钟前
JavaScript 面向对象入门到精通
前端·javascript
Wang's Blog4 分钟前
Java 项目实战: 外卖平台-修改分类与新增窗口复用
服务器·项目开发
一条溺水的鱼10 分钟前
一次讲透 JS 闭包 —— 概念、原理、应用和内存泄漏
javascript·面试
吠品12 分钟前
STM32最小系统板引脚梳理与配置实操
前端·javascript·vue.js
曹一二15 分钟前
前端性能优化场景题:图片懒加载 + 大数据渲染
前端
GISer_Jing21 分钟前
Come on,工作总结
前端·ai·前端框架
Hilaku24 分钟前
Sass 和 Less 在 2026 年彻底多余了吗?
前端·javascript·程序员
右耳朵猫AI24 分钟前
Node.js周刊2026W38 | 进程中断缺陷修复、Copilot 迁至 Rust、Node 新增 VFS
javascript·后端·node.js
百慕大三角29 分钟前
AI 写代码最大的风险不是不会写,而是太能写:我给 Coding Agent 加的 4 层工程约束
前端·ai编程·trae
Shao23929 分钟前
基于 Rokid AIUI:在眼镜上穿越五千年
javascript