axios で要求/応答のログ出力を共通化するには

予め axios.interceptors.request.use、axios.interceptors.response.use を設定すれば OK です。

import axios from 'axios';

axios.interceptors.request.use(
  config => {
    const {
      method,
      url,
    } = config;
    const {
      params = config.params,
      data,
    } = config.data || {};
    console.log(method, url, params, data);
    return config;
  });

axios.interceptors.response.use(
  res => res,
  err => {
    const {
      config,
      response,
    } = err;
    const {
      method,
      url,
    } = config || {};
    if (response) {
      const {
        status,
        statusText,
        data,
      } = response;
      console.log(method, url, status, statusText, data);
    }
    else {
      console.log(method, url, err.toString());
    }
    return Promise.reject(err);
  });

要求のログ出力(4〜13行目)、失敗のログ出力(20〜38行目)をしています。
正常なレスポンスならログ出力も不要かと思うので、何もしていません。(18行目)

コメント