タグ : Axios
實務上 then() 與 await 在 Vue 使用方式
ECMAScript 2015 提出了 Promise 後，提供了 then() 用法，而 ECMAScript 2017 又提出了 await 用法，但 Vue 該如何活用 then() 與 await 呢 ?
呼叫 API 顯示 Nested Promise
若 API 遵循 RESTful 精神設計，常會第一個 API 僅回傳 id，若要取得其值就要呼叫第二個 API，也就是所謂 N + 1，本文分別以 Aysnc Await、Promise Chain 與 RxJS 三種寫法示範。
SweetAlert2 之 Error Handling
一般來說呼叫 API 的 Asynchronous 才會遇到 Promise，也才需要 Error Handling，但 SweetAlert2 按下 Confirm 時回傳 Fulfilled Promise，按下 Cancel 時回傳 Rejected Promise，此時會進入處理 API 的 Error Handling，這該如何解決呢 ?
如何對 API 回傳資料加上 Cache ?
若 API 每次傳入的 Query String 相同，所回傳的結果也相同，對於這類 API 可以加上 Cache，當參數相同時，就不再發起 API Request，如此不但節省後端資源，使用者體驗更佳。事實上 ECMAScript 的 Closure + IIFE 就能實作出 Cache，並不需要依賴其他 Library。
如何處理相依性 API ?
實務上有些 API 呼叫有順序性，無論 Promise 或 Observable 都是 Asynchronous，不保證回傳順序也不保證一定成功，因此處理這些 Asynchronous 動作並不像 Synchronous 般簡單。
如何解決 Vue 開發環境違反 Same-Origin Policy ?
若前後端分離，且同時在本機開發 Vue 前端與 Node 後端時，很容易遇到違反 Same-Origin Policy 問題，本文介紹多種方式解決。
如何管理 JWT Token ?
管理 JWT Token 是前端不可避免的課題，若只透過 Vuex 或 Local Storage 都有其缺憾，唯有同時結合 Vuex 與 Local Storage 才是最完美方案。
如何將 Binary 轉成 Base64 String ?
一般 API 對於圖片都會回傳 Base64 String，若 API 是回傳 Binary 呢 ? 此時我們就得自行 Encode 成 Base64 String 在才能顯示圖片。
如何在 Axios 存取使用 Basic Auth 的 API ?
某些採用 Basic Auth 的 API，必須在 Header 提供帳號密碼才能取取，這該如何在 Axios 使用呢 ?