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


相关推荐
彭亚川Allen16 分钟前
从零手搓 RAG 之检索全流程,给大模型接上自己的知识库
前端·后端·ai编程
2401_8685347818 分钟前
数据交换方式
服务器·网络
IT_陈寒18 分钟前
别让Java字符串拼接偷偷吃掉你的内存
前端·人工智能·后端
软件技术NINI1 小时前
圣罗兰彩妆html+css 4页
前端·css·html
中屹指纹浏览器svip1 小时前
打开账号环境网页报错,常见原因有哪些?
服务器·开发语言·php·中屹指纹浏览器
2401_868534781 小时前
以太网物理层标准
服务器·网络
tg_xianheyun1 小时前
亚马逊云服务器部署网站的步骤与上线检查清单
服务器·阿里云·云计算
2601_951615201 小时前
网站模板 网站网页模板下载
前端·网络·html
酷炫码神2 小时前
Day 1|HTML5:一个商城首页的骨架,从 DOCTYPE 到语义化
前端·html·html5
云边云科技_云网融合2 小时前
从 POS 机到访客 Wi-Fi:零售门店安全建设的完整解法
服务器·网络·数据库