AbortController.abort()

Экспериментальная возможность: Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Метод abort() интерфейса AbortController прерывает DOM запрос (например Fetch запрос) до его завершения. Это позволяет прервать fetch запросы, использование любого ответа Body и потоков.

Синтаксис

controller.abort();

Параметры

Отсутствуют.

Возвращаемое значение

Не возвращает.

Примеры

В следующем фрагменте мы будем загружать видео используя Fetch API.

Сначала мы создаём контроллер с помощью конструктора AbortController(), а затем получаем ссылку на связанный объект AbortSignal используя свойство AbortController.signal.

Когда fetch запрос инициируется, мы передаём AbortSignal в качестве опции внутрь объекта параметров запроса (см. {signal} ниже). Это связывает сигнал и контроллер с fetch запросом и позволяет нам прервать его, вызвав AbortController.abort(), как показано ниже во втором обработчике событий.

var controller = new AbortController();
var signal = controller.signal;

var downloadBtn = document.querySelector('.download');
var abortBtn = document.querySelector('.abort');

downloadBtn.addEventListener('click', fetchVideo);

abortBtn.addEventListener('click', function() {
  controller.abort();
  console.log('Загрузка прервана');
});

function fetchVideo() {
  ...
  fetch(url, {signal}).then(function(response) {
    ...
  }).catch(function(e) {
    reports.textContent = 'Ошибка загрузки: ' + e.message;
  })
}

Примечание: Когда abort() вызывается, fetch() промис отклоняется с AbortError.

Вы можете найти полный работающий пример на GitHub — см. abort-api (увидеть работу в живую).

Спецификации

Specification
DOM Standard # ref-for-dom-abortcontroller-abortcontroller①

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

Fetch API