如何配置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 分钟前
验证码识别实战:前端不写页面,改训模型了?
前端
MomentYY8 分钟前
Temperature:AI 的“脑洞旋钮”
前端·llm·ai编程
远航_29 分钟前
OpenSpec 完整详细介绍
前端·后端
召钱熏39 分钟前
状态枚举正确≠渲染正确:一个语音按钮的状态机边界修复实录
android·前端
SkyWalking中文站41 分钟前
认识 Horizon UI · 1/17:SkyWalking 新一代可观测性控制台
运维·前端·监控
cidy_9841 分钟前
Dify 操作教程:工作流编排 & Chat 对话编排
前端·工作流引擎
tangdou36909865543 分钟前
AI真好玩系列-2分钟快速了解DeepAgents | Quick Guide to DeepAgents in 2 Minutes
前端·javascript·后端
张元清44 分钟前
React useIntersectionObserver Hook:懒加载与可见性检测(2026)
javascript·react.js
小四的小六1 小时前
AI Agent效果评测实战——搭完Agent才是噩梦的开始
前端
梨子同志1 小时前
JavaScript
前端