Axios interceptor повторяет http-запрос, когда статус равен 200, а данные пусты

Question

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

Когда данные не готовы, я получаю 200 с пустым массивом.

Когда данные готовы, я получаю 200 с непустым массивом.

Я использую следующие библиотеки https://github.com/axios/axios https://github.com/softonic/axios-retry

 try {

   const axiosInstance = axios.create();

   axiosInstance.interceptors.response.use((response) => {

     if (response.data.metrics.length === 0) {
       const error = new Error("Metrics Not Ready");
       return Promise.reject(error);

     }
     return response;
   }, (error) => {
     return Promise.reject(error);
   });

   axiosRetry(axiosInstance, {
     retries: 10,
     retryCondition: (error) => {
       console.log("RETRY CONDITION", error);
     },
   });

   const metrics = await axiosInstance(options);

 } catch (error) {
   console.log(error);
 }

Я создал перехватчик axios, чтобы проверить длину массива, если его 0, я выбрасываю ошибку.Однако это не ловится axiosRetry, который в этот момент я хочу повторить запрос.Вместо этого он попадает в блок try catch и заканчивается.

Answer 1

Вам не нужно повторять аксиос, все, что вам нужно, это axios и его перехватчик ответа, со следующими шагами:

1. Проверьте, не заполнены ли данные. Если да, выведите ошибку axios.Cancel. Это отменит запрос, вызвав обработчик ошибок вместо обработчика успеха.
2. В обработчике ошибок повторно отправьте HTTP-запрос, если мы не превысили максимальное число повторов (в вашем случае это 10).
3. Продолжайте выполнять шаги 1 и 2, пока мы не получим данные или не повторим попытку 10 раз.

Код будет выглядеть следующим образом:

const axios = require('axios');

const MAX_RETRY = 10;
let currentRetry = 0;

function successHandler() {
  console.log('Data is Ready');
}

function errorHandler() {
  if (currentRetry < MAX_RETRY) {
    currentRetry++;
    console.log('Retrying...');
    sendWithRetry();
  } else {
    console.log('Retried several times but still failed');
  }
}

function sendWithRetry() {
  axios.get('http://example.com')
    .then(successHandler).catch(errorHandler);
}

axios.interceptors.response.use(function (response) {
  if (response.data.metrics.length) {
    throw new axios.Cancel('Operation canceled by the user.');
  } else {
    return response;
  }
}, function (error) {
  return Promise.reject(error);
});

sendWithRetry();

Для axios-retry, к сожалению, вы не можете повторить HTTP-запрос, когда статус ответа 200 OK, так как axios-retry использует axios.interceptors.response.use, но ничего не делает для «успешного ответа».

Вот соответствующий код в исходном файле axios-retry es/index.js. Вы можете видеть, что перехватчик успешного ответа null:

export default function axiosRetry(axios, defaultOptions) {
  axios.interceptors.request.use(config => {
    const currentState = getCurrentState(config);
    currentState.lastRequestTime = Date.now();
    return config;
  });

  axios.interceptors.response.use(null, error => {
    const config = error.config;

    // If we have no information to retry the request
    if (!config) {
      return Promise.reject(error);
    }
    ....