修改Vue2项目运行端口号配置后端代理教程
更新时间：2026年01月12日 09:55:06 作者：qq_53154643
文章介绍了在Vue2项目中配置端口号和代理解决跨域问题的方法,包括在vue.config.js文件中增加端口号配置和设置代理路径
一.端口号简单配置
在Vue2项目的vue.config.js文件中增加如下配置：
module.exports={
//...
devServer:{
port:8888//此处修改你需要的端口号
}二.配置proxy代理
1.简单配置单个代理
请求到/api/xxx现在会被代理到请求 http://localhost:8888/api/xxx
例如 /api/user 现在会被代理到请求 http://localhost:8888/api/user
modile.exports={
//...
devServer:{
proxy:{
'/api':'http://localhost:8888'
}
}
}2.配置多个代理路径
将多个路径代理到同一个target下，你可以使用由一个或多个具有context属性的对象构成的数组：
module.exports = {
//...
devServer: {
proxy: [{
context: ['/auth', '/api'],
target: 'http://localhost:8888',
}]
}
};3.解决跨域问题
module.exports = {
//...
devServer: {
proxy: {
'/api': {
target: 'http://localhost:8888',
changeOrigin: true,//开启代理：在本地会创建一个虚拟服务端，然后
//发送请求的数据，并同时接收请求的数据，这样服务
//端和服务端进行数据的交互就不会有跨域问题
}
}
}
};总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
本篇文章主要介绍了详解vue-cli 构建Vue项目遇到的坑，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-08-08
这篇文章主要为大家详细介绍了vue购物车插件的编写代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-11-11
使用Vant完成DatetimePicker 日期的选择器操作
这篇文章主要介绍了使用Vant完成DatetimePicker 日期的选择器操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-11-11
这篇文章主要介绍了vue长按事件和点击事件冲突的解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
v-model绑定的变量无论是对象还是数组都是绑定的value值,下面这篇文章主要给大家介绍了关于vue中v-model如何绑定多循环表达式的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-11-11
最近公司项目有个导出ppt的功能,在使用ppexgen.js一周完成功能之后,这篇文章主要给大家介绍了关于前端vue如何使用pptxgen.js导出PPT的相关资料,需要的朋友可以参考下2024-01-01
这篇文章主要介绍是八种vue实现组建通信的方式，包括、props 父组件与子组件通信、$emit 子组件父组件传递、$emit与props结合 兄弟组件传值等等，想具体了解的朋友可以参考下面文章的具体内容2021-09-09
这篇文章主要介绍了关于Ant-Design-Vue快速上手指南+排坑，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-06-06
在Vue项目中,我们通常需要在组件、指令、插件等不同部分之间导入和导出功能,这篇文章主要介绍了vue3的基本指令以及对js的导入和导出方法的相关资料,需要的朋友可以参考下2025-10-10
使用vue3.0时，因为底层是使用proxy进行代理的所以当我们打印一些值得时候是proxy代理之后的是Proxy<BR>对象，Proxy对象里边的[[Target]]才是真实的对象，那么如何获取这个值呢，下面下面给大家介绍两种方式，感兴趣的朋友一起看看吧2023-01-01
最新评论