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


相关推荐
IT_陈寒几秒前
Vue的computed属性差点让我加班到凌晨
前端·人工智能·后端
涛涛ing3 分钟前
一天写1000行被开除,一周写100行反被升职:2026前端的“工作量陷阱”
前端
实心儿儿4 分钟前
Linux —— 五种IO模型与非阻塞IO
运维·服务器
IMPYLH5 分钟前
HTML 的 <meter> 元素
前端·html
筝筝ba9 分钟前
extended/factory_reset.robot
linux·运维·服务器·网络·网络协议·p2p
优化Henry14 分钟前
5G网络切片之S-NSSAIlist相关参数解析
运维·服务器·网络·笔记·学习·信息与通信
奔跑的卡卡16 分钟前
不只校验单个接口:基于接口调用图谱的全链路请求合法性校验方案
前端·web安全
子有内涵20 分钟前
【Linux】C++ 实现可扩展 TCP 服务器|回响、字典、远程命令
linux·运维·服务器
fxss26 分钟前
免费儿童学习网站推荐!拼音、诗词、成语故事、认知启蒙,孩子需要的,这里全都有!
前端
luj_176830 分钟前
毒素驱动的生物自毁机制探析
服务器·c语言·开发语言·经验分享·算法