Живой пример доступен здесь: https://jsfiddle.net/6mx7q3hk/33/

Описание

Несомненно, самая удивительная особенность библиотеки RxJS - это большое количество операторов, позволяющих изменять поток данных. Как разработчик JavaScript вы делаете много HTTP-запросов, и иногда вам приходится иметь дело с временно не обслуживаемым сервером. Конечно, самый простой способ - перейти на страницу с ошибкой и оставить пользователя в слезах. Однако с помощью оператора RxJS retryWhen вы можете повторить запрос, если выполняются указанные условия.

Цель

Основная цель сегодняшнего упражнения - повторить HTTP-запрос, который изначально не удался из-за внутренней ошибки сервера. По истечении заданного времени (период 6 секунд) я предполагаю, что сервер готов к обработке, и если пользователь разрешено получать данные, возвращается ответ со статусом 200.

Решение

Вместо того, чтобы делать настоящий HTTP-запрос, я использую объект server с методом getData, возвращающий наблюдаемый объект carsData, если статус ответа равен 2. **.

Первоначально статус ответа - 500 (я имитирую сервер, который не работает), поэтому выдается ошибка (для простоты ошибка содержит только статус). Если вы просто подписываетесь на возвращаемый наблюдаемый объект из вызова метода сервера getData будет вызван метод наблюдателя error. Оператор retryWhen позволяет повторить запрос вместо того, чтобы отказываться от него после первого сбоя. Функция, предоставленная оператору, получает поток ошибок, и вам необходимо вернуть наблюдаемый объект, который после выдачи значения вызовет повторную попытку запроса. Последовательность сценария выглядит следующим образом:

  • наблюдаемый, возвращенный из getData, выдает ошибку (строка «500»),
  • поток errors (переданный в качестве первого параметра обратного вызова retryWhen) выдает строку «500»,
  • Истекает 1 секунда (период, предоставленный оператору delay),
  • если статус ошибки начинается с '5', выполняется цель отладки console.log и запрос повторяется (наблюдаемый объект, возвращаемый методом getData, снова подключается к нему),
  • если статус ошибки не начинается с «5», ошибка выдается повторно и повторная попытка не выполняется,
  • процесс завершается, если либо статус ответа сервера равен 2 **, либо выдается ошибка со статусом, отличным от 5 **.

В приведенном выше примере я просто меняю статус ответа по истечении как минимум 6 секунд с помощью функции setTimeout. Новый статус случайным образом устанавливается на 200 или 403. Если вы откроете консоль браузера, вы увидите, что после нескольких сообщений «Retrying…» либо console.log из next или обработчик ошибки наблюдателя .

Примечания

  • если вы хотите повторить запрос заданное количество раз, вы можете использовать оператор retry, который просто принимает максимальное количество попыток в качестве параметра,
  • повторная попытка не будет выполняться не только при возврате потока из ошибок обратного вызова retryWhen, но и после его завершения. Это дает вам множество альтернатив для обработки временного сбоя запроса,
  • Общие сценарии использования оператора retryWhen включают в себя: повторную попытку через определенный период времени, максимальное количество повторных попыток n раз с временными интервалами или, как в сегодняшнем примере, повторную попытку или шаблон повторного вызова.

Молись, люби, ненавидь, хлопай!