首页 > 其他分享 >Axios

Axios

时间:2023-04-21 21:24:18浏览次数:37  
标签:axios 示例 request Axios 拦截器 user

Axios介绍:

基于promise网络请求,实现异步获取请求数据。( 无需重新加载页面完成局部数据刷新 )

示例一:

<!--引入Axios-->
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

axios.get('/user',{
    params: { //传参 ->   '/user?id=123'
      id: 123
    }
  }).then( //成功获取数据 回调
 
).catch({ //异常
 
})

示例二:

Axios在Vue中的模块封装

下载

npm install axios --save

 

封装 request

import axios from 'axios'
const request = axios.create({
  baseURL: 'http://localhost:7777',
  timeout: 5000
})
export default request

调用

import request from '@/utils/request'
export default {
  login(data) {
      return request({
          url: '/user/login',
          method: 'post',
          data
      })
  },
  {
   
  }
  ...
}

拦截器

// 请求拦截器
axios.interceptors.request.use(function (config) {
   
});

// 响应拦截器
axios.interceptors.response.use(function (response) {
   
});
 

标签:axios,示例,request,Axios,拦截器,user
From: https://www.cnblogs.com/cwyzl/p/17341836.html

相关文章

  • vue全家桶进阶之路47:Vue3 Axios拦截器封装成request文件
    可以将Axios拦截器封装成一个单独的request文件,以便在整个应用程序中重复使用。以下是一个示例,展示如何将Axios拦截器封装成一个request文件:1、创建一个名为request.js的新文件,并导入Axios:importaxiosfrom'axios';2、创建一个名为request的函数,并将其导出:这将创建一个名......
  • vue全家桶进阶之路46:Vue3 Axios拦截器和globalProperties全局设置
    在Vue.js3中,使用Axios与Vue.js2.x中类似,但是需要进行一些修改和更新,下面是Vue.js3中Axios的定义和使用方式:首先,你需要安装Axios和Vue.js3.x,可以使用npm或yarn等包管理工具安装:npminstallaxiosvue@next然后,在你的Vue.js3应用程序中,你可以使用以下代码来导入和使用Axio......
  • Module not found: Error: Can't resolve 'axios' in 'D:\BaiduSyncdisk\vue-cli-pr
    Modulenotfound:Error:Can'tresolve'axios'in'D:\BaiduSyncdisk\vue-cli-project\dc_vue3\src\utils'  因:没有安装axios插件在运行项目的地方npminstall--saveaxios解决办法 npminstall--saveaxios......
  • axios的二次封装(详解)
    一.首先让我们了解一下为什么要对axios进行二次封装?1,代码封装,重用性高,减少代码量,减低维护难度。2,统一处理一些常规的问题一劳永逸,如http错误。3,拦截请求和响应,提前对数据进行处理,如获取token,修改配置项。 安装axiosnpm下载npminstallaxios下载完成之后在main.js中全局......
  • axios
    axios使用参考:http://www.axios-js.com/zh-cn/docs/index.html#axios-API定时:https://blog.csdn.net/weixin_43574035/article/details/126233221......
  • 复选框数据通过axios和Vue传输到servlet后台
    引言本来是想百度一下如何将table标签里面嵌入的复选框通过axios以及Vue传输到Servlet后台;百度之后才发现,是我草率了,原来可以直接用复选框标签进行传输(好吧,又暴露了自己基础不扎实的事实......)相关实现步骤1、将相关的标签el-checkbox引入进去这里我们需要引入三个带有el的标......
  • vue3中使用axios
    1、问题:在vue2中axios通常是经过封装的后挂载使用的,来处理token及报错处理,比如//main.jsimportajaxfrom'@/axios.js'Vue.prototype.ajax=ajax在项目中使用也很方便this.ajax就行了,那vue3中是如何简单、便捷的封装并使用呢2、思路:vue3中使用axios并不难,封装,然后......
  • node中使用axios时:Error: unable to verify the first certificate 报错
    参考https://www.daozhao.com/10611.html报错原因:  在使用浏览器访问时,客户端、服务器在握手阶段完成验证。当我们在node中使用axios请求时,客户端没法确认服务端的TLS证书解决方案1、局部constaxios=require('axios')consthttps=require('https')//在axios......
  • 源码共读 | axios 工具函数
    前言Axios是一个非常流行的库,它可以让你简单、方便地发送HTTP请求。它可以用在浏览器和node.js中,并且支持跨域请求。在Github上拥有快接近10w颗星了,可见其受欢迎程度。下面就来学习一下axios工具函数的源码。仓库地址:axios/axios:PromisebasedHTTPclientfortheb......
  • axios实现无感刷新token
    letisRefreshing=false标识当前正在刷新token//重试队列,每一项将是一个待执行的函数形式letrequests=[]axios.interceptors.response.use(response=>{const{code}=response.dataif(code===401){//具体code看和后端定义的是什么,这里是401co......