Определить xhr.status === 0 в аксиосах - PullRequest
0 голосов
/ 15 сентября 2018

Контекст

У меня есть веб-приложение, работающее в корпоративной среде, где все запросы проходят через прокси, который я не контролирую. Этот слой автоматически перенаправляет моих пользователей на страницу единого входа в другой домен по мере необходимости.

Вот основная последовательность:

  1. Пользователь вводит myapp.example.corp в свой браузер
  2. Запрос проходит через прокси, который проверяет, вошел ли пользователь в систему
  3. Пользователь не вошел в систему, поэтому он перенаправлен на вход в auth.example.corp
  4. Пользователь входит в систему и перенаправляется в мое приложение

Пока все хорошо.

проблема

Проблема, о которой я хочу спросить, возникает в следующем сценарии:

  1. Пользователь выполняет некоторую работу в моем приложении, затем идет домой, оставляя открытую вкладку браузера
  2. Проходит некоторое количество раз, и сеанс пользователя истекает
  3. Пользователь возвращается на вкладку браузера с открытым моим приложением и возобновляет его использование
  4. Мое приложение отправляет запросы AJAX, и они проходят через один и тот же прокси
  5. Поскольку пользователь больше не вошел в систему, эти запросы перенаправляются на страницу входа в систему
  6. Поскольку эта страница входа находится в другом домене, в консоль браузера заносится следующая информация, что отлично подходит для понимания происходящего
Failed to load https://auth.example.corp: No 'Access-Control-Allow-Origin'
header is present on the requested resource. Origin 'https://myapp.example.corp'
is therefore not allowed access.

(Этот вопрос не о CORS. Я не могу контролировать прокси-сервер или сервер авторизации. Пожалуйста, не отвлекайтесь. ?)

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

// none of these callbacks get called
axios
  .get("/signedin")
  .then(response => console.log("Signed in"))
  .catch(response => console.log("Not signed in"))

Обходной путь

Если я вместо этого использую XMLHttpRequest API, я смогу обнаружить эту ситуацию, потому что происходит событие onreadystatechange, и я могу проверить на request.status === 0.

var request = new XMLHttpRequest();
request.onreadystatechange = event => {
  if (request.readyState === 4 && request.status === 0) {
    console.log("Not signed in");
  }
};
request.open("GET", "/signedin");
request.send();

Вопрос

Итак, мой вопрос: я действительно хотел бы продолжать использовать axios, но быть в состоянии обнаружить эту ситуацию. Есть ли какой-нибудь способ обнаружения xhr.status == 0 при использовании axios или я вынужден использовать XMLHttpRequest?

1 Ответ

0 голосов
/ 15 сентября 2018

CORS - это проблема, всякий раз, когда предварительный запрос не выполняется, браузер полностью запрещает доступ к таким вещам, как код состояния возврата, тело ответа и заголовки. Вот почему axios никогда не узнает об этом и может быть причиной того, что обещание не закрывается. это похоже на сбой сети без ограничения по времени. Но вы можете попробовать перехватчик, как это, чтобы обнаружить такие условия

axios.interceptors.response.use((response) => response, (error) => {
  if (typeof error.response === 'undefined') {
      //alert the failure
  }
  return Promise.reject(error);
});
...