如何配置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 小时前
高性能服务器程序框架详解(包括Reactor,有限状态机等)
linux·服务器·开发语言·网络·c++
春日见12 小时前
自动驾驶数据驱动规控进化之路
运维·服务器·人工智能·深度学习·算法·机器学习·自动驾驶
程序猿乐锅12 小时前
Linux常用命令详解:目录、文件、压缩、编辑与查找
linux·运维·服务器
Shadow(⊙o⊙)12 小时前
库的制作与原理1.0,库打包,协作,目标文件.o、ELF格式。
linux·运维·服务器·开发语言
ai_coder_ai12 小时前
使用web ide开发和调试自动化脚本
前端·ide·自动化
wyc是xxs12 小时前
用纯 Node.js 写了一个 JS 解释器 — kernel-js-lite
开发语言·javascript·npm·node.js
kaikaile199512 小时前
盲源分离(BSS)程序代码:信号处理与模态识别
前端·信号处理
之歆12 小时前
Day01_ES6+ 专业指南:从基础到实战的现代JavaScript开发(上)
javascript·mysql·es6
weixin_BYSJ198712 小时前
基于Django的非物质文化遗产管理系统设计与实现(源码 + 文档)98950
java·javascript·spring boot·python·django·flask·php
এ慕ོ冬℘゜12 小时前
从零封装企业级通用确认弹窗组件|高复用、低耦合、适配全场景
开发语言·前端·javascript