vite配置了proxy代理情况下如何查看真实的接口调用地址
2023-07-11
388 字约 2 分钟
...vite配置了proxy代理情况下如何查看真实的接口调用地址?
使用vite进行代理
在vite.config.ts配置了代理

在浏览器查看请求头和响应头发现只有代理前的url,没有显示代理后的路径

然后发现一个bypass函数,但是此函数只能修改res响应头的数据,没法修改req请求头的数据,于是我将代理后的实际路径,设置到了相应头上面,方便分析代理后的实际路径,如图 
然后就可以在响应头上面看到实际的 真实代理路径了

在这里插入图片描述
其实,就是自己拼装了一下数据,将实际的请求路径拼接好,然后放在响应头上。
如果您觉得这篇文章有帮助,请点个赞吧~
相关文章
更多文章 →vite工具2026-03-17
深度解析:NODE_ENV 与 Mode (模式)
在现代前端开发中,尤其是使用 Vite 、 Qwik 、 Next.js 等基于 Node.js 的构建工具时,开发者经常会被两个相似的概念绕晕: 和 Mode (模式) 。 它们看起来都在做同一件事:“区分开发环境和生产环境”。但实际上,它们在架构设计中扮演着截然不同却又紧密协作的角色。混淆这两者可能导致构建配置错误、环境变量加载失败,甚至生产环境泄露敏感信息。 一、核心定义:它们到底是什么? 1\. :行业通用的“运行时开关” 起源...
学习
vite工具2025-10-01
vite常用配置
目录 1\. 基础配置 1.1 项目初始化 1.2 基础 vite.config.js 配置 配置说明与最佳实践 插件配置 (plugins) 好处 : 插件系统是Vite的核心特性,提供了丰富的功能扩展能力 坏处 : 过多插件会增加构建时间,插件冲突可能导致构建失败 建议 : 只引入必要的插件,定期检查插件更新和兼容性 适用场景 : 所有Vite项目都需要根据技术栈选择合适的插件 开发服务器配置 (server) host: ‘0.0...
学习
vite工具2025-06-04
Vite 项目中使用 vite-plugin-dts 插件的详细指南
在现代前端开发中,TypeScript 的类型声明文件( )对于提供良好的开发体验和代码提示至关重要。如果你正在使用 Vite 构建一个库项目, 插件是一个非常有用的工具,它可以帮助你自动生成 文件。以下是如何在你的 Vite 项目中安装、配置和使用 插件的详细指南。 一、插件介绍 是一个用于在 Vite 的库模式下,从 或 源文件生成类型文件( )的插件。它能够帮助开发者在构建库时,自动生成类型声明文件,从而提高开发效率。 二、安装插...
学习
vite工具2025-03-11
vite项目打包build后提示说超过500k了
说可以通过配置build.rollupOptions.output.manualChunks来提升一下,好可以,我来配置一下,把那些可能大的包单独分配一下: 然后再看一下,是变小了,但是还是500警告啊: 那就开始分析是哪个包比较大吧,使用rollup plugin visualizer这个插件来分析一下,rollup plugin visualizer是一个开源项目,地址: 安装: 配置插件 在 文件中添加 插件的配置,如下: 构建完...
学习
vite工具2024-10-10
一次低端机 WebView 白屏的兼容之路
问题 项目:Vite4 + Vue3,APP WebView 项目 页面在 OPPO A5 手机上打不开,页面空白。 最开始是客户端在看,然后发现一个警告,大概也因为没看出什么问题,给到 Web 前端。 相关背景 为了方便描述过程的行为,先做一些相关背景的介绍。知道这些背景才能更好的了解问题的复杂。这些在解决问题的过程中始终是干扰因素,在反复调试试错的过程中才梳理总结出来,这里把它们列出来。 使用测试 App,其中有两个入口,一个是本地...
学习
vite工具2024-09-09
推荐工具vite-plugin-fake-server,可线上部署使用mockmock线上部署
最近遇到了个麻烦,后端迟迟给不了接口,测试那边又要求数据不能写死,必须可以提供mock调试。这不最近找到了一个mock工具,能解决传统mock工具无法线上部署的问题。 工具名字叫做 ,兼容vite,从官网示例上来看是同时支持 和 来模拟数据的。使用起来也非常简单,分三步走就行。 1. 安装 2. 引入 这里贴出最简单的配置,一个是制定文件夹,一个是设置在生产环境下模拟数据。 3. 使用 这里我根据个人习惯,在 文件夹下创建一个 和数个模...
学习
评论
请登录后发表评论
去登录