2024年最新vue配置proxy跨域代理_vue配置多个跨域proxy(1),前端开发前景
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue
免费下载资源
·
最后
中年危机是真实存在的,即便有技术傍身,还是难免对自己的生存能力产生质疑和焦虑,这些年职业发展,一直在寻求消除焦虑的依靠。
-
技术要深入到什么程度?
-
做久了技术总要转型管理?
-
我能做什么,我想做什么?
-
一技之长,就是深耕你的专业技能,你的专业技术。(重点)
-
独立做事,当你的一技之长达到一定深度的时候,需要开始思考如何独立做事。(创业)
-
拥有事业,选择一份使命,带领团队实现它。(创业)
一技之长分五个层次
-
栈内技术 - 是指你的前端专业领域技术
-
栈外技术 - 是指栈内技术的上下游,领域外的相关专业知识
-
工程经验 - 是建设专业技术体系的“解决方案”
-
带人做事 - 是对团队协作能力的要求
-
业界发声 - 工作经验总结对外分享,与他人交流
永远不要放弃一技之长,它值得你长期
信仰持有
。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
主要内容包括html,css,html5,css3,JavaScript,正则表达式,函数,BOM,DOM,jQuery,AJAX,vue 等等。
以上配置结束
方式一:设置单个代理
- 优点:配置简单,请求资源时直接发给前端(8080)即可。
- 缺点:不能配置多个代理,不能灵活的控制请求是否走代理。
- 工作方式:若按照上述配置代理,当请求了前端不存在的资源时,那么该请求会转发给服务器 (优先匹配前端资源)
//原路径http://192.168.1.182:3000/wgapi/vod/front/vodrank/getTagVideos
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
lintOnSave: false, //是否使用link检查代码
devServer: {
// 设置代理服务器
// 方法一:设置单个代理
proxy: 'http://192.168.1.182:3000',
}
});
方式二:设置多个代理
- 优点:可以配置多个代理,且可以灵活的控制请求是否走代理。
- 缺点:配置略微繁琐,请求资源时必须加前缀。
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
devServer:{
proxy:{
// 代理1
// 当你请求是以/api开头的时候,则我帮你代理访问到http://127.0.0.1:3000
'/api': {
target: 'http://127.0.0.1:3000',
// secure: false,// 如果是https接口,需要配置这个参数
// ws: true, //是否代理websockets, 默认值为true
/\*
changeOrigin设置为true时,服务器收到的请求头中的host为:localhost:3000
changeOrigin设置为false时,服务器收到的请求头中的host为:localhost:8080
changeOrigin默认值为true
\*/
changeOrigin: true, // 设置请求头中的host地址,默认值为true
//地址中的 /api 仅仅是一个请求转发标志,真正的接口中没有/api,所以在转发时重写请求路径,把/api删掉。
pathRewrite: {'^/api' : ''}
},
// 代理2
'/douyu':{
target: 'http://open.douyucdn.cn',
pathRewrite: {'^/douyu' : ''}
}
}
}
设置多个代理
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
lintOnSave: false, //是否使用link检查代码
devServer: {
//方式二:设置多个代理
proxy:{
//这个路径为http://192.168.1.182:3000/douyu/wgapi/vod/front/vodrank/getTagVideos
### 最后
中年危机是真实存在的,即便有技术傍身,还是难免对自己的生存能力产生质疑和焦虑,这些年职业发展,一直在寻求消除焦虑的依靠。
* 技术要深入到什么程度?
* 做久了技术总要转型管理?
* 我能做什么,我想做什么?
* **一技之长,就是深耕你的专业技能,你的专业技术。**(重点)
* 独立做事,当你的一技之长达到一定深度的时候,需要开始思考如何独立做事。(创业)
* 拥有事业,选择一份使命,带领团队实现它。(创业)
**一技之长分五个层次**
* 栈内技术 - 是指你的前端专业领域技术
* 栈外技术 - 是指栈内技术的上下游,领域外的相关专业知识
* 工程经验 - 是建设专业技术体系的“解决方案”
* 带人做事 - 是对团队协作能力的要求
* 业界发声 - 工作经验总结对外分享,与他人交流
> 永远不要放弃一技之长,它值得你长期`信仰持有`。
**[开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/topics/618166371)**
> 主要内容包括html,css,html5,css3,JavaScript,正则表达式,函数,BOM,DOM,jQuery,AJAX,vue 等等。
![](https://i-blog.csdnimg.cn/blog_migrate/a608986f6b6f4a640823fc4473f99936.png)
GitHub 加速计划 / vu / vue
207.55 K
33.66 K
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:3 个月前 )
73486cb5
* chore: fix link broken
Signed-off-by: snoppy <michaleli@foxmail.com>
* Update packages/template-compiler/README.md [skip ci]
---------
Signed-off-by: snoppy <michaleli@foxmail.com>
Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 5 个月前
e428d891
Updated Browser Compatibility reference. The previous currently returns HTTP 404. 6 个月前
更多推荐
已为社区贡献3条内容
所有评论(0)