一個axios的簡單教程

轉載自https://www.jianshu.com/p/13cf01cdb81f

收錄學習

首先要明白的是axios是什麼:axios是基於promise(諾言)用於瀏覽器和node.js是http客戶端。

axios的作用是什麼呢:axios主要是用於向後臺發起請求的,還有在請求中做更多是可控功能。

特點:支持瀏覽器和node.js

            支持promise

            能攔截請求和響應

            能轉換請求和響應數據

            能取消請求

            自動轉換JSON數據

             瀏覽器支持防止CSRF(跨站請求僞造)

這裏你一定會想promise是什麼東西,以下是promise的個人理解:

promise是什麼:是一個對象用來傳遞異步操作的信息,它代表了某個未來纔會知道結果的事件(通常是一個異步操作),並且這個事件提供統一的api,可供進一步的處理。

promise的作用:Promise的出現主要是解決地獄回調的問題,比如你需要結果需要請求很多個接口,這些接口的參數需要另外那個的接口返回的數據作爲依賴,這樣就需要我們一層嵌套一層,但是有了Promise 我們就無需嵌套。

promise的本質是什麼:分離異步數據獲取和業務

基本使用方法:

axios執行GET請求

GET 請求方法

執行POST請求

POST請求方法

執行多個併發請求

多個併發請求

get和post都是基於promise的所以寫法上很相似,是用then和catch,使用這種方法來進行發送請求。

還有一個axios重要的知識點就是攔截器

攔截器

在請求或響應被 then 或 catch 處理前攔截它們(攔截器可以做什麼:在請求或者響應時攔截下來進行處理)

攔截器分爲請求攔截器和響應攔截器

請求攔截器(interceptors.requst)是指可以攔截每次或指定HTTP請求,並可修改配置項。

響應攔截器(interceptors.response)可以在每次HTTP請求後攔截住每次或指定HTTP請求,並可修改返回結果項。

 

攔截器的寫法

攔截器的工作流程:

攔截器工作流程

移除攔截器

移除攔截器

自定義 axios 實例添加攔截器

添加攔截器

取消

使用 cancel token 取消請求

可以使用 CancelToken.source 工廠方法創建 cancel token

參考資料:axios中文文檔

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章