前端接口联调系列之axios的使用

这是我参与8月更文挑战的第15天，活动详情查看：8月更文挑战

写在前面：

• 本文作为本人学习总结之用，同时分享给大家~
• 个人前端博客网站：zhangqiang.hk.cn
• 欢迎加入博主的前端学习qq交流群：：706947563，专注前端开发，共同学习进步！

目前常用的接口联调有以下几种：

• ajax

  传统 Ajax 指的是 XMLHttpRequest（XHR）， 最早出现的发送后端请求技术，隶属于原始js中，核心使用XMLHttpRequest对象，多个请求之间如果有先后关系的话，就会出现回调地狱。

• axios （本章讲解）

  axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端，本质上也是对原生XHR的封装，只不过它是Promise的实现版本，符合最新的ES规范，它本身具有以下特征：

  1.从浏览器中创建 XMLHttpRequest 
  2.支持 Promise API 
  3.客户端支持防止CSRF 
  4.提供了一些并发请求的接口（重要，方便了很多的操作） 
  5.从 node.js 创建 http 请求 
  6.拦截请求和响应 
  7.转换请求和响应数据 
  8.取消请求 
  9.自动转换JSON数据
  

• fetch

  fetch号称是AJAX的替代品，是在ES6出现的，使用了ES6中的promise对象。

axios在日常开发中的使用

// 介绍
axios({
    url: '连接地址 path参数直接放里面',
    method: 'post 默认是 get',
    params: '必须是一个无格式对象 query参数',
    data: '是作为请求主体被发送的数据 body参数',
    timeout: 1000,
    headers: 'object 发送的自定义请求头'
})
​
// 调用示例
axios({
    method: 'post',
    url: '/user/12345',
    data: {
        firstName: 'Fred',
        lastName: 'Flintstone'
    }
})
.then(function (response) {
    console.log(response);
})
.catch(function (error) {
    console.log(error);
});

真棒，看到了末尾！   码字不易，点赞是最大的支持哦！