Перехватчики VueJS - Axios не получают ответа 401

#javascript #axios #httprequest

Вопрос:

Я пытаюсь настроить перехватчик запросов и ответов для Axios, когда я делаю запросы Post, однако я могу заставить отвечать только перехватчик запросов, и ничего больше, я включил пример того, что он не работает:

Вот настройка axios:

 import axios from "axios";

axios.defaults.baseURL = "https://btk7dl15c9.api.quickmocker.com";

axios.interceptors.request.use(
  async (config) => {
    console.log("request ok");
    return config;
  },
  (error) => {
    console.log("request error");
    return Promise.reject(error);
  }
);
axios.interceptors.response.use(
  (response) => {
    console.log("response ok");
    return response;
  },
  (error) => {
    console.log("response error");
    return Promise.reject(error);
  }
);

export default {
  methods: {
    axiosPost(url, data) {
      return axios.post(url, data);
    }
  }
};

https://codesandbox.io/s/keen-shockley-xccsx

Мне нужно иметь возможность перехватывать 401, чтобы иметь возможность выполнять вызов обновления токена (не входит в пример)

1. в вашем коде нет ничего плохого. даже ваш пример работает. посмотрите на журнал консоли Error: Request failed with status code 401

2. Проблема в том, что я хочу иметь возможность фиксировать эту ошибку с помощью перехватчиков, поскольку мне нужно будет иметь возможность обновлять токены

3. да, перехватчик не работает. даже если ответ равен 401

Ответ №1:

Вы использовали "axios": "0.21.2" , в котором, похоже, есть ошибка в перехватчике, которую они исправили v0.21.3

если вы 0.21.3 согласны или 0.21.1 согласны с этим, это должно исправить вашу проблему.

проверьте журнал выпуска: https://github.com/axios/axios/releases/tag/0.21.3