Axios的功能特点
1.在浏览器中发送XMLHttpRequests请求
2.在node.js中发送http请求
3.支持Promise API
4.拦截请求和响应
5.转换请求和响应数据
6.其他...Axios框架的安装使用
在终端中,通过命令安装
npm install axios --save
在main.js中导入
import axios from 'axios'Axios的请求方式
1.axios(config)
2.axios.request(config)
3.axios.get(url[,config])
4.axios.delete(url[,config])
5.axios.head(url[,config])
6.axios.post(url[,data[,config]])
7.axios.put(url[,data[,config]])
8.axios.patch(url[,data[,config]])Axios最基本的使用
在导入axios后,配置数据信息
axios({
url:'需要请求的服务器地址',
method:'请求的方式(get/post)'
}).then((res)=>{
console.log(res) //输出请求后返回的内容
})Axios发送的并发请求
all()方法: 接收的是一个伪数组,数组里存放我们发送的请求
axios.all([axios({...},axios({...},...其他请求))]).then((res)=>{...返回的结果处理})
返回的结果也是一个数组类型.在开发的过程中,我们不推荐通过全局的axios请求去获取数据,我们希望通过实例去获取数据
不推荐:
import axios from 'axios'
axios({
...配置信息
})
推荐使用:
创建一个network文件夹,里面存在一个文件request.js文件,在这个文件里导入axios,然后创建它的实例
import axios from 'axios'
1.创建axios实例对象
const instance=axios.create({
...配置axios相关的通用的信息,如:
baseURL:'默认的网络请求地址'
timeout:时间数 //网络超时时间
....
})
2.通过实例对象发送请求
instance({
....网络请求相关配置信息
})
3.在文件中导入Axios的拦截器
interceptors。
请求拦截的作用:
1.当网络配置信息中的一些信息不符合服务器的要求时,拦截下来进行修改.
2.每次发送网络请求时,都希望在界面中显示一个请求的图标,可以在这里设置
3.对于某些网络请求(比如登录(token)),必须携带一些特殊的信息.
1.全局axios的网络拦截器
对于网络请求的拦截
axios.interceptors.request.use(config=>{
return config //将拦截到的数据返回出去(这里是必须返回的,不返回,则不能正常接收数据)
},err=>{
return err //将拦截到的数据返回出去(这里是必须返回的,不返回,则不能正常接收数据)
})
config是一个函数参数,携带配置信息,对于请求配置的内容拦截修改
err是一个函数参数,对于拦截失败执行的函数
对于响应拦截
axios.interceptors.response.use(res=>{
...相应的处理代码
return res //将拦截到的数据返回出去(这里是必须返回的,不返回,则不能正常接收数据)
},err=>{
...相应的处理代码
return err //将拦截到的数据返回出去(这里是必须返回的,不返回,则不能正常接收数据)
})
res是一个对于对于响应数据拦截进行处理的函数
err是一个对于响应数据拦截失败进行处理的函数
2.实例对象拦截器
实例对象.interceptors.request.use(config=>{
return config //将拦截到的数据返回出去(这里是必须返回的,不返回,则不能正常接收数据)
},err=>{
return err //将拦截到的数据返回出去(这里是必须返回的,不返回,则不能正常接收数据)
}) 实例对象.interceptors.response.use(res=>{
...相应的处理代码
return res //将拦截到的数据返回出去(这里是必须返回的,不返回,则不能正常接收数据)
},err=>{
...相应的处理代码
return err //将拦截到的数据返回出去(这里是必须返回的,不返回,则不能正常接收数据)
})在使用axios时,推荐用Promise封装axios,然后在进行调用使用.
axios 没有网络时返回什么
转载文章标签 axios 没有网络时返回什么 node.js es6 vue.js javascript 文章分类 iOS 移动开发
下一篇:android 启动音乐应用