axios使用方法（Axios简介）

Axios

1.Axios简介

Axios 是一个基于 promise 的 HTTP 库    
    
    
，可以用在浏览器和 node.js 中

axios的github: https://github.com/axios/axios

Axios 是一个基于 promise 的 HTTP 库   


     


     


   ，简单的讲就是可以发送get  
    
    
   、post等请求



 




 




 

，可以用在浏览器和 node.js 中    
    
    
。React等框架的出现   

   

   

，促使了Axios轻量级库的出现    

     

     

  ，因为Vue等




  




  




  
，不需要操作Dom  


  


  


，所以不需要引入Jquery.js了   


     


     


   。

promise

异步编程的一种解决方案

所谓Promise     
     
     
 ，简单说就是一个容器




   




   




   ，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果

Promise提供统一的API
 



 



 



，各种异步操作都可以用同样的方法进行处理

Promise对象代表一个异步操作               ，有三种状态：Pending（进行中）

     


     


     

、Resolved（已完成 




    




    




    ，又称Fulfilled）和Rejected（已失败）



 




 




 

。只有异步操作的结果















，可以决定当前是哪一种状态               ，任何其他操作都无法改变这个状态 (英语意思就是“承诺    
    
    
”  



     



     



    ，表示其他手段无法改变)

与事件（Event）完全不同















，事件的特点是    
    
    
，如果你错过了它   


     


     


   ，再去监听



 




 




 

，是得不到结果的   

   

   

。 有了Promise对象   

   

   

，就可以将异步操作以同步操作的流程表达出来    

     

     

  ，避免了层层嵌套的回调函数

2.特性 从浏览器创建 XMLHttpRequests 从 node.js 创建 http 请求 支持 Promise API 拦截请求和响应 转换请求和响应数据 取消请求 自动转换JSON数据 客户端支持防御XSRF 3.引入Axios

首先就是引入axios

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

使用 npm:

$ npm install axios 4.Axios提供的请求方法 axios(config) axios.request(config) axios.get(url[, config]) axios.delete(url[, config]) axios.head(url[, config]) axios.post(url[, data[, config]]) axios.put(url[, data[, config]]) axios.patch(url[, data[, config]]) 5.Axios的config的配置信息 { // `url` 是对应访问服务器的请求 url: /user, // `method` 用于设置请求方法




  




  




  
，默认是get method: get, // default //设置路径url的统一前缀 baseURL: https://some-domain.com/api/, //`params`是以URL中?后的参数形式提交 params: { ID: 12345 }, //data数据会放入request body中 //支持request methods PUT, POST, DELETE , PATCH data: { firstName: Fred }, //method为post提交方式  


  


  


，以字符串放入请求体中     
     
     
 ，没有key data: Country=Brasil&City=Belo Horizonte, // `timeout` specifies the number of milliseconds before the request times out. // If the request takes longer than `timeout`, the request will be aborted. timeout: 1000, // default is `0` (no timeout) // `responseType` 设置服务器返回数据类型




   




   




   ，默认是json
 



 



 



，一般不用改动 // 可用项: arraybuffer, document, json, text, stream responseType: json // default } 6.Response

axios响应对象包括了以下信息

{ // `data`是服务器提供的响应信息 data: {}, // `status` 是HTTP的响应状态码 status: 200, // `statusText`是HTTP的响应文本信息 statusText: OK, // `headers` 响应信息的HTTP的headers headers: {}, // `config`是axios请求中的配置对象信息 request config: {}, // `request` 是请求对象信息 request: {} }