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


相关推荐
2301_771717217 小时前
Jackson的使用方法详解
java·服务器·前端
似水এ᭄往昔7 小时前
【Linxu】--进程优先级和进程切换
linux·运维·服务器
A923A7 小时前
【小兔鲜电商前台 | 项目笔记】第八天
前端·vue.js·笔记·项目·小兔鲜
海参崴-7 小时前
Linux进程管理完全指南
linux·运维·服务器
DYuW5gBmH7 小时前
Chrome DevTools MCP 让 AI 无缝接管浏览器调试会话
前端·chrome·chrome devtools
CQU_JIAKE7 小时前
4.4【A】
运维·服务器
echome8887 小时前
JavaScript Promise 与 async/await 实战:5 个高频异步编程场景的优雅解决方案
开发语言·javascript·ecmascript
qq12_8115175157 小时前
Java Web 影城会员管理系统系统源码-SpringBoot2+Vue3+MyBatis-Plus+MySQL8.0【含文档】
java·前端·mybatis
星河耀银海8 小时前
JAVA IO流:从基础原理到实战应用
java·服务器·开发语言
摸鱼仙人~8 小时前
Math.js 使用教程
开发语言·javascript·ecmascript