Vue学习笔记6--配置代理

一、axios

Axios 是一个基于 promise 网络请求库,作用于node.js 和浏览器中。 它是 isomorphic 的(即同一套代码可以运行在浏览器和node.js中)。在服务端它使用原生 node.js http 模块, 而在客户端 (浏览端) 则使用 XMLHttpRequests。

二、配置代理

1. 方法一

在Vue.config.js中添加如下配置:

devServer:{proxy: 'http://localhost:5000'}

说明:

  • 优点: 配置简单,请求资源时直接发给前端(8080)即可
  • 缺点:不能配置多个代理,不能灵活的控制请求是否走代理
  • 工作方式:若按照上述配置代理,当请求了前端不存在的资源时,那么该请求会转发给服务器(优先匹配前端资源)

2. 方法二

编写vue.config.js配置具体代理规则:

 devServer: {proxy: {'/api': { //匹配所有以'api'开头的请求路径target: 'http://localhost:5000',//代理目标的基础路径pathRewrite:{'^/api':''},// ws: true,//用于支持websocket//changeOrigin: true},'/demo': {target: 'http://localhost:5001',pathRewrite:{'^/demo':''},// ws: true,//用于支持websocket//changeOrigin: true},}}/*changeOrigen设置为true时,服务器收到的请求头中的host为:localhost:5000changeOrigen设置为false时,服务器收到的请求头中的host为:localhost:8000changeOrigen默认值为true*/

说明:

  • 优点:可以配置多个代理,且可以灵活的控制请求是否走代理
  • 缺点:配置略微繁琐,请求资源时必须加前缀。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/628335.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python 自学(八) 之模块

目录 1. import语句导入模块 P206 2. from ... import 语句导入模块 P207 3. 模块的搜索目录 sys.path P209 4. 以主程序的形式执行 __name__ P212 5. python中的包 P213 1. import语句导入模块 P206 同一目录下&…

K8S滚动更新守护进程集

Updating a DaemonSet 更新守护进程集 DaemonSets are great for deploying services across an entire cluster, but what about upgrades? Prior to Kubernetes 1.6, the only way to update Pods managed by a DaemonSet was to update the DaemonSet and then manually d…

响应式Web开发项目教程(HTML5+CSS3+Bootstrap)第2版 第1章 HTML5+CSS3初体验 项目1-1 三栏布局页面

项目展示 三栏布局是一种常用的网页布局结构。 除了头部区域、底部区域外,中间的区域(主体区域)划分成了三个栏目,分别是左侧边栏、内容区域和右侧边栏,这三个栏目就构成了三栏布局。当浏览器的宽度发声变化时&#x…

【java八股文】之JVM基础篇

【java八股文】之JVM基础篇-CSDN博客 【java八股文】之MYSQL基础篇-CSDN博客 【java八股文】之Redis基础篇-CSDN博客 【java八股文】之Spring系列篇-CSDN博客 【java八股文】之分布式系列篇-CSDN博客 【java八股文】之多线程篇-CSDN博客 【java八股文】之JVM基础篇-CSDN博…

设计模式-委托模式

设计模式专栏 模式介绍模式特点应用场景委托模式在GUI编程场景的应用代码示例Java实现委托模式Python实现委托模式 委托模式在spring中的应用 模式介绍 委托模式是一种软件设计模式,其中一个对象(委托对象)将某些操作委托给另一个对象&#…

css深度选择器 /deep/

一、/deep/的含义和使用 /deep/ 是一种 CSS 深度选择器,也被称为深度组合器或者阴影穿透组合器,主要用在 Web 组件样式封装中。 在 Vue.js 或者 Angular 中,使用了样式封装技术使得组件的样式不会影响到全局,也就是说组件内部的…

C++函数(4)

短信计费 题目描述:用手机发短信,一条短信资费为0.1元,但限定一条短信的内容在70个字以内(包括70个字)。如果你一次所发送的短信超过了70个字,则会按照每70个字一条短信的限制把它分割成多条短信发送。假设…

《Python 3 基础》- numpy的array,python的list、tuple的区别与联系再辨析

这里写自定义目录标题 一、基本认识二、list与传统数组(以C为例)的联系与区别三、1维list切片规则四、2维list类似于2维数组,但表达方式需适应五、list与元组的联系与区别1. tuple的创建方法类似于list,tuple用(&#…

白码CRM快速实现报价转订单功能

某crm项目已经做到销售模块了,销售模块实现了从报价到销售单,再到财务模块的应收流程。但使用过程中发现不好用的地方:报价通过后客户下单,销售相关人员又要重新录入数据一样的销售单,觉得这样的操作比较繁琐&#xff…

【STM32】HAL库的STOP低功耗模式UART串口唤醒,第一个接收字节出错的问题(已解决)

【STM32】HAL库的STOP低功耗模式UART串口唤醒,第一个接收字节出错的问题(已解决) 文章目录 BUG复现调试代码推测原因及改进方案尝试中断时钟供电外设唤醒方式校验码硬件问题 切换到STOP0模式尝试结论和猜想解决方案附录:Cortex-M…

【leetcode100-035】【链表/哈希链表】LRU缓存

【题干】 请你设计并实现一个满足 LRU (最近最少使用) 缓存 约束的数据结构。 实现 LRUCache 类: LRUCache(int capacity) 以 正整数 作为容量 capacity 初始化 LRU 缓存int get(int key) 如果关键字 key 存在于缓存中,则返回关键字的值,…

说清楚Kubernetes、Docker、Dockershim、Containerd、runC、CRI、OCI的关系

Kubernetes v1.20版本 的 release note 里说 deprecated docker。并且在后续版本 v1.24 正式删除了 dockershim 组件,这对我们有什么影响呢?Kubernetes 1.20: The Raddest Release | Kubernetes 为了搞明白这件事情,以及理解一系列容器名词 …

仿真机器人-深度学习CV和激光雷达感知(项目2)day01【项目介绍与环境搭建】

文章目录 前言项目介绍功能与技术简介硬件要求环境配置虚拟机运行项目demo 前言 💫你好,我是辰chen,本文旨在准备考研复试或就业 💫本文内容是我为复试准备的第二个项目 💫欢迎大家的关注,我的博客主要关注…

03.neuvector之组的划分逻辑

neuvector之组的划分逻辑 原文链接,欢迎大家关注我的github账号 一、组的定义 NeuVector 会自动从正在运行的应用程序中创建组。这些组以前缀‘nv‘开头。您也可以使用 CRD 或 REST API 手动添加它们,并且可以在任何模式下创建、发现、监视或保护。网络和响应规则需…

Java language programming:List的使用

&#xff08;源于PTA&#xff09; 题目&#xff1a; <1>.定义Person类。 <2>.定义私有属性String name,int age,使用Eclipse生成每个属性setter 、getter&#xff0c;有参Person(String name,int age) 、无参构造方法&#xff0c;toString方法。 <3>.定义Mai…

现阶段Python和Java哪个更吃香?

现阶段Python和Java哪个更吃香&#xff1f; 在开始前我有一些资料&#xff0c;是我根据网友给的问题精心整理了一份「Java的资料从专业入门到高级教程」&#xff0c; 点个关注在评论区回复“888”之后私信回复“888”&#xff0c;全部无偿共享给大家&#xff01;&#xff01;&…

论文阅读 Vision Transformer - VIT

文章目录 1 摘要1.1 核心 2 模型架构2.1 概览2.2 对应CV的特定修改和相关理解 3 代码4 总结 1 摘要 1.1 核心 通过将图像切成patch线形层编码成token特征编码的方法&#xff0c;用transformer的encoder来做图像分类 2 模型架构 2.1 概览 2.2 对应CV的特定修改和相关理解 解…

一个小程序跳转到另一个小程序中如何实现

小程序 保证两个小程序是一样的主体才可以跳转。怎么知道是不是同样的主体呢&#xff1f; 小程序的后台管理-设置-基本设置-基本信息。查看主体信息。 跳转 <button clicktoOtherMini()>跳转到另一个小程序</button> function toOtherMini(){wx.navigateToMini…

GPT实战系列-简单聊聊LangChain搭建本地知识库准备

GPT实战系列-简单聊聊LangChain搭建本地知识库准备 LangChain 是一个开发由语言模型驱动的应用程序的框架&#xff0c;除了和应用程序通过 API 调用&#xff0c; 还会&#xff1a; 数据感知 : 将语言模型连接到其他数据源 具有代理性质 : 允许语言模型与其环境交互 LLM大模型…

python中的overload

Python中的overload 类似函数重载方法第一种第二种 类似函数重载方法 参考链接&#xff1a;Python中重写&#xff08;override&#xff09; 第一种 结起来&#xff0c;在Python中可以使用重写&#xff08;override&#xff09;来重新定义父类中的方法&#xff0c;但并不存在…