Vue axios インターセプターは、繰り返しリクエストのキャンセルによく使用されます。

CancelToken は axios.CancelToken に置き換えられます。
const ソース = CancelToken.source();

axios.get('/user/12345', {
  キャンセルトークン: ソース.token
}).catch(関数(スロー) {
  もし（axios.isCancel（スロー））{
    console.log('リクエストがキャンセルされました', throwed.message);
  } それ以外 {
     // エラーを処理する }
});

axios.post('/user/12345', {
  名前: '新しい名前'
}, {
  キャンセルトークン: ソース.token
})

// リクエストをキャンセルします（メッセージパラメータはオプションです）
source.cancel('ユーザーによって操作がキャンセルされました。');

CancelToken は axios.CancelToken に置き換えられます。
キャンセルする;

axios.get('/user/12345', {
  キャンセルトークン: 新しいキャンセルトークン(関数executor(c) {
    // 実行関数はキャンセル関数をパラメータとして受け取ります cancel = c;
  })
});

// リクエストをキャンセルする
キャンセル（）;

'axios' から axios をインポートします
'./config' から baseURL をインポートします。
'qs' から qs をインポートします

const pendingRequest = new Map(); // リクエストオブジェクト const CancelToken = axios.CancelToken;

axios.defaults.timeout = 30000
axios.defaults.baseURL = ベースURL.target

// リクエストインターセプターを追加 axios.interceptors.request.use(function(config) {
  // リクエストを送信する前に何かを行う config.headers = {
      'コンテンツタイプ': 'application/json',
      'トークン': getToken()
  }
  // リクエストキーを取得する
  requestKey = getReqKey(config); を設定します。

  // 繰り返しリクエストかどうかを判断します if (pendingRequest.has(requestKey)) { // 繰り返しリクエストです removeReqKey(requestKey); // キャンセル }else{
    // キャンセルトークンを設定する
    config.cancelToken = 新しいCancelToken(関数executor(cancel) {
      pendingRequest.set(requestKey, cancel); // 設定 })
  }

  設定を返します。
}, 関数 (エラー) {
  // リクエストエラー return Promise.reject(error);
});

// レスポンスインターセプターを追加する axios.interceptors.response.use(function (response) {
  // リクエストオブジェクト内の requestKey を削除します
  requestKey = getReqKey(response.config); を設定します。
  リクエストキーを削除します。

  // 返されたデータを使って、ステータスをインターセプトするなどの処理を実行します。if (response.data.status !== 200) {
      トースト（{
        メッセージ: response.data.message、
        タイプ: '警告'、
        期間: 1000
      })
      戻る
    }
    
  // 問題ありません。サーバーのデータを返します。 return response.data;
}, 関数 (エラー) {
  requestKey = getReqKey(error.config); を設定します。
  リクエストキーを削除します。
  
  // レスポンスエラー return Promise.reject(error);
});

// リクエストキーを取得する
関数 getReqKey(config) {
  // リクエストメソッド、リクエストアドレス、リクエストパラメータによって生成された文字列は、リクエストを繰り返すかどうかの基準として使用されます。const { method, url, params, data } = config; // これらのパラメータを分解します // GET ---> params POST ---> data
  const requestKey = [メソッド、URL、qs.stringify(params)、qs.stringify(data)].join('&');
  requestKeyを返します。
}

// 重複したリクエストをキャンセルする function removeReqKey(key) {
  const cancelToken = pendingRequest.get(キー);
  cancelToken(key); // 以前に送信したリクエストをキャンセルします pendingRequest.delete(key); // リクエストオブジェクト内の requestKey を削除します
}