前言

隨著 vuejs 作者尤雨溪發布消息，不再繼續維護vue-resource，并推薦大家使用 axios 開始，axios 被越來越多的人所了解。本來想在網上找找詳細攻略，突然發現，axios 的官方文檔本身就非常詳細！！有這個還要什么自行車！！所以推薦大家學習這種庫，最好詳細閱讀其官方文檔。大概翻譯了一下 axios 的官方文檔，相信大家只要吃透本文再加以實踐，axios 就是小意思啦！！

如果您覺得本文對您有幫助，不妨點個贊或關注收藏一下，您的鼓勵對我非常重要。

axios 簡介

axios 是一個基于Promise 用于瀏覽器和 nodejs 的 HTTP 客戶端，它本身具有以下特征：

瀏覽器兼容性

引入方式：

或者使用cdn：

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

舉個栗子：

執行 GET 請求

執行 POST 請求

執行多個并發請求

axios API

可以通過將相關配置傳遞給 axios 來進行請求。

axios(config)

請求方法別名

為了方便起見，已經為所有支持的請求方法提供了別名。

注意

當使用別名方法時，不需要在config中指定url，method和data屬性。

并發

幫助函數處理并發請求。

創建實例

您可以使用自定義配置創建axios的新實例。

實例方法

可用的實例方法如下所示。 指定的配置將與實例配置合并。

請求配置

這些是用于發出請求的可用配置選項。 只有url是必需的。 如果未指定方法，請求將默認為GET。

使用 then 時，您將收到如下響應：

配置默認值

您可以指定將應用于每個請求的配置默認值。

全局axios默認值

自定義實例默認值

配置優先級順序

配置將與優先順序合并。 順序是lib / defaults.js中的庫默認值，然后是實例的defaults屬性，最后是請求的config參數。 后者將優先于前者。 這里有一個例子。

你可以截取請求或響應在被 then 或者 catch 處理之前

如果你以后可能需要刪除。

處理錯誤

您可以使用validateStatus配置選項定義自定義HTTP狀態碼錯誤范圍。

消除

您可以使用取消令牌取消請求。

axios cancel token API基于可取消的promise提議，目前處于階段1。

您可以使用CancelToken.source工廠創建一個取消令牌，如下所示：

您還可以通過將執行器函數傳遞給CancelToken構造函數來創建取消令牌：

注意：您可以使用相同的取消令牌取消幾個請求。

使用application / x-www-form-urlencoded格式

默認情況下，axios將JavaScript對象序列化為JSON。 要以應用程序/ x-www-form-urlencoded格式發送數據，您可以使用以下選項之一。

瀏覽器

在瀏覽器中，您可以使用URLSearchParams API，如下所示：

請注意，所有瀏覽器都不支持URLSearchParams，但是有一個polyfill可用（確保polyfill全局環境）。

或者，您可以使用qs庫對數據進行編碼：

Node.js

在node.js中，可以使用querystring模塊，如下所示：

你也可以使用qs庫。

Promise

axios 依賴本機要支持ES6 Promise實現。 如果您的環境不支持ES6 Promises，您可以使用polyfill。

TypeScript

axios包括TypeScript定義。

axios在很大程度上受到Angular提供的$http服務的啟發。 最終，axios努力提供一個在Angular外使用的的$http-like服務。

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com