axios はサーバと非同期に通信を行う HTTP クライアントの 1 つで、 Laravel
でもbootstrap.jsで読み込まれています。
Vue
と組み合わせる場合コンポーネントのメソッドにaxios.get()やaxios.post()など処理と組み合わせて呼び出すのですが、全体を通して共通させたい処理(エラーハンドリングなど)がある場合、interceptorsを使って処理に割り込むことができます。
axios.interceptors.request.use(config => {
return config;
});
axios.interceptors.response.use(
response => {
return response;
},
error => {
return error;
}
);axios/axios: Promise based HTTP client for the browser and node.js
interceptorsを使うと、response や error の処理完了時にあわせて
Snackbars
を使った成功/失敗メッセージを表示することや、request 時に
Progress indicators
を表示して、response が返ってきたときには非表示に切り替える、または error
のときは色を変更するなどのグローバルな処理ができるようになります。
