在vue项目中封装axios

news2024/9/25 17:15:27

在哪里封装:

封装axios,src文件夹下新建一个util的文件夹,这个文件夹就是放一些工具的,可以在这里面封装axios。新建一个js文件,这里是在http.js文件里封装axios

封装axios的第一种方案:函数法

方法:先导入axios,然后按照函数封装的办法封装,要有返回值,然后export导出对象,对象里面是各种函数。 

在外部使用:

导入http文件:

因为http文件导出的是一个对象,所以用的时候像下面这样;

axios第二种封装办法:axios自带的封装方法


以后不用axios来请求,而是用axios创建的实例http来请求:

// 2-对于数据的封装方法:
import axios from 'axios'
const http = axios.create({
  baseURL: 'https://m.maizuo.com',
  timeout: 10000,
  headers: {
    'X-Client-Info':
    '{"a":"3000","ch":"1002","v":"5.2.1","e":"16661470114057618813288449","bc":"440100"}'
  }
})
export default http

用axios.create()创建一个实例http,以后这个http实例就代表axios本身了。这个用的是axios自己的一种方式,来做的自定义配置。导出http即可使用。

参数说明: 

baseURL:指的是网址的域名+(端口号)

timeout:请求数据限制的时间范围

headers:数据验证里的“X-Client-Info”,这个字段是大多时候是重复的

上面代码的含义是:

每次往baseURL这个地址发请求,如果请求10s数据没回来就超时了,每次请求都会带上这个headers。

使用方式:

这样在使用的时候就可以拿http直接来用了,url中把公共的域名去掉(也就是去掉baseURL里的域名),headers中把相同的x-Client-Info去掉:(每个网站信息不一样也正是因为‘X-Host’字段不一样。)

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

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

相关文章

【Numpy】NumpyQuickStart

Numpy快速入门 Ding Jiaxiong【2022-12-17】 Gitee仓库:https://gitee.com/DingJiaxiong/machine-learning-study.git 文章目录Numpy快速入门先决条件导包基础知识举个栗子数组的创建数组的打印基本操作通用功能索引切片和迭代形状操作更改数组的形状将不同的数组堆叠在一起将一…

【进阶C语言】什么?你居然还不知道结构体可以实现位段?一文带你速通位段结构的使用

目录 🤩前言🤩: 🤯正文:位段🤯: 1.位段概述: 2.位段的内存分配: 3.位段的跨平台问题: 4.位段的应用: 🥳总结🥳&#x…

[附源码]Node.js计算机毕业设计好又多百货商业广场有限公司自助收银操作系统Express

项目运行 环境配置: Node.js最新版 Vscode Mysql5.7 HBuilderXNavicat11Vue。 项目技术: Express框架 Node.js Vue 等等组成,B/S模式 Vscode管理前后端分离等等。 环境需要 1.运行环境:最好是Nodejs最新版,我…

三面美团测开岗,HR 现场直接发 offer,他是横着走出来的

前情提要 这是一个发生在我朋友身上的真实事情: 这里就叫他程序员 Y 吧。 程序员 Y 工作不到两年,周末在朋友圈发了个喜报,准备入职美团。 之后,我就带着祝福跟 Y 聊了许久,聊天的内容就是具体了解一下他面试的过程…

事业编招聘:气象局2023年度公开招聘公告

宁夏回族自治区气象局2023年度公开招聘应届高校毕业生公告(气象类) 根据《事业单位人事管理条例》《事业单位公开招聘人员暂行规定》和《气象部门事业单位公开招聘应届高校毕业生管理办法(试行)》等有关规定和工作需要&#xff0…

C++ 面向对象

C 面向对象,内存管理(未完。。。) 对象内存模型 类型转换 dynamic_cast type_info 多态 虚函数 override final虚表结构 运行时类型信息(RTII)基类析构函数必须为虚函数,否则会有内存泄漏的危险继承有两…

GitHub 推出对所有公共存储库的免费秘密扫描

GitHub 正在推出对其代码托管平台上所有公共存储库的免费扫描公开秘密(例如凭据和授权令牌)的支持。 秘密扫描是一种安全选项,组织可以启用它以进行额外的存储库扫描,以检测已知类型的秘密的意外暴露。 它通过匹配合作伙伴和服务…

【Java编程系列】Mybatis的Interceptor注入yml自定义变量,多种实现方式

1、前言 当前有一个任务,需要将mybatis的sql进行拦截过滤处理,而拦截处理时,需要有一些白名单放行的配置方法名路径。所以,这里使用到了yml的配置文件来配置变量路径,而后引入拦截器做动态放行。 2、注入自定义变量方式…

5点起床,一直干到11点的外卖小哥转行程序员,入职起薪12K

“我是要成为卷王的男人”是95后的小魏的座右铭,曾经的他5点起床,10分钟洗漱完毕就开始了一天的工作—送外卖。是的,曾经的他是万千外卖小哥的其中一员。 19年毕业的小魏学的是土木工程,曾经他也在工地待过,风尘仆仆却…

教程!!!!!

使用门槛:需要自行准备能开全局代理的科学工具 好评赠送免费科学工具,也可以自己准备科学工具。 下单以后,我们会发送一串账号密码给您。如图: 其中卡号就是chatgpt的账号,密码就是chatgpt密码。 第一步&#xff1…

星火计划学习笔记——第八讲Apollo控制模块解析与实践1

文章目录1. 控制理论简介1.1 控制的作用1.2 自动驾驶控制的目标1.3自动驾驶控制器的设计2. 汽车运动学与动力学2.1 常用的自动驾驶控制算法2.2 车辆运动学模型 Kinematics2.3 车辆动力学模型 Dynamics3. Apollo控制模块3.1 Apollo控制模块3.2 规划与控制相配合3.3 Apollo控制模…

零基础学习编程,选择什么编程语言比较合适?

随着互联网的兴起,越来越多的人想要学习编程,却不知道该从哪开始学,小编就通过以下几点给大家分析一下,零基础入门学习编程,该如何选择编程语言。 1、哪一门语言容易入门! 所有语言的知识体系分为三大块&…

SAP ABAP 物料主数据的视图维护状态

SAP ABAP 物料主数据的视图维护状态 引言: 物料主数据的视图维护状态会经常使用,是物料主数据批量创建/修改的逻辑路由。 关键字:SAP ABAP VPSTA PSTAT T132T 文章目录SAP ABAP 物料主数据的视图维护状态1. 技术说明2. 维护状态3. 维护记录…

Linux——实用指令

帮助指令 man 获得帮助信息 基本语法 man [命令或配置文件] 注意:命令可以组合使用,比如ls -al,ls -la help 获得shell内置命令的帮助信息 基本语法 help命令 时间日期类 date指令 显示当前日期 基本语法 date(显示…

【细胞分割】原子力显微镜图像分析【含GUI Matlab源码 1371期】

⛄一、AFM简介 理论知识参考文献:原子力显微镜(AFM)图像的计算机辅助分析 ⛄二、部分源代码 function varargout AFManalysis(varargin) % AFMANALYSIS M-file for AFManalysis.fig % AFMANALYSIS, by itself, creates a new AFMANALYSIS…

【图像处理】高效斑点特征提取技术研究(Matlab代码实现)

👨‍🎓个人主页:研学社的博客 💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜…

10年经验Python老司机分享:转行如何自学Python并且找到工作?

目前信息化产业发展势头很好,互联网就成为了很多普通人想要涉及的行业,因为相比于传统行业,互联网行业涨薪幅度大,机会也多,所以就会大批的人想要转行来学习Python开发。 零基础学习Python必须明确的几点: …

5个千兆网口,将有什么样高速网络传输体验?——米尔MYD-J1028X开发板实测分享

本篇测评由电子工程世界的优秀测评者“HonestQiao ”提供。 此次的板卡测试,是米尔MYD-J1028X开发板的高速网络数据传输测试体验。 01 本次测试的主角 米尔MYD-J1028X开发板提供了5个超级给力的最高支持千兆网络接口,具体如下: 通过查看官…

基于AD936X+Intel FPGA的射频方案

基于ADI AD936X和Intel Cyclone V FPGA的射频方案,适合于无线通信基础设施、防务电子系统、RF测试设备和仪器以及通用软件定义无线电平台等应用。 关于ADI AD936X系列射频收发器 AD936X系列的工作频率范围覆盖从70 MHz到6 GHz。它是一系列完整的无线电设计&#x…

底层网络知识详解:最重要的传输层-第11讲-TCP协议(上):因性恶而复杂,先恶后善反轻松

上一节,我们讲的UDP,基本上包括了传输层所必须的端口字段。它就像我们小时候一样简单,相信“网之初,性本善,不丢包,不乱序”。 后来呢,我们都慢慢长大,了解了社会的残酷,变得复杂而成熟,就像TCP协议一样。它之所以这么复杂,那是因为它秉承的是“性恶论”。它天然认…