когда нечего делать, а творческая душа требует реализации и хочется что-то сделать или написать, то я пишу сюда или делаю что-то на этом сайте. Кому интересна web-разработка, wordpress и то что рядом с этим, то заходите на мой сайт и читайте всякое...
Как отменить запрос на сервер (promise axios & fetch)
Недавно я проходил собеседование и мне задали вопрос к которому я не был готов. Этот вопрос про то как можно отменить запрос на сервер. На тот момент я не знал ответ и я пошёл исследовать это. В этой статье мы рассмотрим как отменить promise.
XMLHttpRequest
До появления fetch мы использовали XMLHttpRequest, у него был метод abort(), достаточно сохранить ссылку на экземпляр реквеста и в нужное время вызвать метод. Исторически сложилось, что из-за того, что мы стали чаще взаимодействовать с сервером нам стало нужно более удобный инструмент. Этим инструментом стал axios. По сути он стал промышленным стандартом.
Если мы говорим об использовании в браузере, то axios обёртка над XMLHttpRequest, а значит у него должен быть метод abort.
Axios
В axios для закрытия промиса мы можем передать параметра cancelToken. Далее пример использования:
Для fetch есть похожее api — AbortController. Пример использования:
let controller = new AbortController();
fetch(url, {
signal: controller.signal
});
controller.abort();
Отдельно можно использовать некоторые свойства и методы свойства signal.
let controller = new AbortController();
let signal = controller.signal;
// срабатывает при вызове controller.abort()
signal.addEventListener('abort', () => alert("отмена!"));
controller.abort(); // отмена!
alert(signal.aborted); // true
На данный момент (26.09.2021) isomorphic-fetch не поддерживает AbortController, используйте axios или как-то разделяйте запросы в nodejs и браузере и используйте стандарный http в nodejs (request.destroy())
P.S.
Переезжаю на новый адрес сайта https://express.xakplant.ru/. Оцените новый блог, напишите как он вам. Я написал его на next js. Если у вас есть вопросы как соединить nextjs и wordpress то обязательно напишите их в комментариях.
Поддержи Xakplant
Я давно хочу развить видеоверсию, но пока этого не получается из-за нехватки ресурсов. Сейчас я собираю деньги на новый компьютер и микрофон. Поддержи xaklant и ты увидишь полезные видео быстрее.