欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Ajax常用封装库——Axios的使用

程序员文章站 2022-03-02 08:26:17
axios 是目前应用最为广泛的 ajax 封装库axios的特性有: 从浏览器中创建xmlhttprequests 从 node.js 创建http请求 支持promiseapi...

axios 是目前应用最为广泛的 ajax 封装库

axios的特性有:

  • 从浏览器中创建 xmlhttprequests
  • 从 node.js 创建 http 请求
  • 支持 promise api
  • 拦截请求和响应
  • 转换请求数据和响应数据
  • 取消请求
  • 自动转换 json 数据
  • 客户端支持防御 xsrf

使用axios时,需要通过使用script标签引入:https://unpkg.com/axios/dist/axios.min.js
axios的中文网链接:axios中文网

axios api

向axios()传递相关配置来创建请求;

  • axios(对象格式的配置选项)
  • axios(url,config)

常用的配置项

  • url:用于请求的服务器url
  • method:创建请求时使用的方法
  • baseurl:传递相对url前缀,将自动加在url前面
  • headers:即将被发送的自定义请求头
  • params:即将与请求一起发送的url参数
  • data:作为请求主体被发送的数据
  • timeout:指定请求超时的毫秒数(0表示无超时时间)
  • responsetype:表示服务器响应的数据类型,默认“json”

代码展示如下:

axios 全局默认值的配置

axios拦截器:在请求或响应被then或catch处理前拦截它们

axios 的请求拦截器

axios 的响应拦截器

axios的快速请求方法

 axios.get(url[,config])

 axios.post(url[,data[,config]])

 axios.delete(url[,config])

 axios.put(url[,data[,config]])

xmlhttprequest2.0,html5对xmlhttprequest类型全面升级,使其变得更加易用、强大。

onload / onprogress

  xml.onload 事件:只在请求完成时触发

  xml.onprogress 事件:只在请求进行中触发

response属性

  以对象的形式表述响应体,其类型取决于responsetype的值。根据responsetype的值,来通过特定的类型请求数据。

  responsetype要在调用open()初始化请求之后,在调用send()发送请求到服务器之前设置才会有效。

以上就是ajax常用封装库——axios的使用的详细内容,更多关于ajax封装库axios的使用的资料请关注其它相关文章!