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


相关推荐
小帅不太帅12 分钟前
我随手发了几张截图,白拿了一个月 AI 顶配会员
前端·github
36岁的我开始学习打篮球12 分钟前
外规内化技术架构
前端
雪隐29 分钟前
用Flutter做背单词APP-03为了给单词库塞满数据,我让AI给我打了上万份工
前端·人工智能·后端
hunterandroid29 分钟前
Android 安全最佳实践:从数据存储到网络通信的防护思路
前端
H Journey30 分钟前
web开发学习:html、css、js
前端·css·html·js
不会C语言的男孩34 分钟前
TCP通信可视化工具,含下载地址
服务器·网络·安全
hunterandroid35 分钟前
Compose 性能优化:从卡顿到丝滑的实战经验
前端
hunterandroid40 分钟前
Kotlin Coroutines 在 Android 项目中的落地实战
前端
不一样的少年_1 小时前
不用框架,手搓 AI Agent:(一) 先让它跑起来
前端·后端·agent
味悲1 小时前
浏览器解析机制与XSS的15种编码绕过
前端·xss