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


相关推荐
benjiangliu8 小时前
LINUX系统-17-EXT系列文件系统(二)
linux·运维·服务器
杨云龙UP8 小时前
Linux 根分区被日志吃满?一次 58G Broker 日志清理实战_2026-05-20
linux·运维·服务器·数据库·hdfs·apache
ㄣ知冷煖★8 小时前
统一网关架构实践:从 Token 鉴权到路由、策略与凭证池转发全链路解析
java·服务器·架构
叶半欲缺8 小时前
Linux通过lvm扩容根目录
linux·运维·服务器
GISer_Jing8 小时前
Three.JS渲染架构解读
java·javascript·架构
发现一只大呆瓜8 小时前
超全 Vite 性能优化指南:网络、资源、预渲染三维落地方案
前端·面试·vite
utf8mb4安全女神9 小时前
Linux网络服务
linux·运维·服务器
IT_陈寒9 小时前
Vue的computed属性怎么突然不更新了?
前端·人工智能·后端
时寒的笔记9 小时前
day13~14核心案例某采招网
开发语言·javascript·ecmascript
智商不够_熬夜来凑9 小时前
【Picker】单选多选
前端·javascript·vue.js