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


相关推荐
Amy_yang8 分钟前
从随机排序到公平洗牌:JavaScript随机抽取问题的优化之路
javascript·性能优化
apollo_qwe12 分钟前
在 JavaScript(包括 ES 规范)开发中,常用的方法可以按数组、对象、字符串、循环 / 迭代等类别整理
javascript
阿巴~阿巴~13 分钟前
TCP服务器实现全流程解析(简易回声服务端):从套接字创建到请求处理
linux·服务器·网络·c++·tcp·socket网络编程
百***060115 分钟前
服务器无故nginx异常关闭之kauditd0 kswapd0挖矿病毒 CPU占用200% 内存耗尽
运维·服务器·nginx
芒鸽17 分钟前
Kuikly Compose vs. Jetpack Compose:一套代码实现真正的全平台原生渲染
前端
w***375117 分钟前
SpringMVC 请求参数接收
前端·javascript·算法
shikisuki23 分钟前
从 0 到 1 手撸一个生产级个人智能仪表盘(求star~)
前端
flashlight_hi36 分钟前
LeetCode 分类刷题:112. 路径总和
javascript·算法·leetcode
草帽lufei38 分钟前
Trae SOLO项目真实需求
前端·前端工程化·trae