vite再vue3.0中的接口代理

最新推荐文章于 2025-08-01 15:25:24 发布

jinfeng_yu

最新推荐文章于 2025-08-01 15:25:24 发布

阅读量1.4k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： vue3 文章标签： proxy 接口

本文链接：https://blog.csdn.net/jinfeng_yu/article/details/119036157

vue3 专栏收录该内容

3 篇文章

订阅专栏

本文探讨了在Vite环境下，由于同时开发接口并代理到不同域名下的问题，两种代理配置方式对比。最初使用了路径Rewrite，导致404；后续通过rewrite函数直接替换路径前缀解决了问题。作者发现第二种写法有效，可能与Vite的内部处理有关。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

因为几位后台同学在同时开发接口，代理到他们各自的域名下，所以要做多个代理，这时出现了问题。
原本的写法是

proxy:{
	/api:{
		target:'baidu.com',
		changeOrgin:true,
		pathRewrite:{
			'^/api':''
		}
	},
	/bpi:{
		target:'baidu.com',
		changeOrgin:true,
		pathRewrite:{
			'^/bpi':''
		}
	},
}

对接接口的时候总是404后来修改成：

proxy:{
	/api:{
		target:'baidu.com',
		changeOrgin:true,
		rewrite: path => path.replace(/^\/api/,'')
	},
	/bpi:{
		target:'baidu.com',
		changeOrgin:true,
		rewrite: path => path.replace(/^\/bpi/,'')
	},
}