Прекратить, прервать выполнения запроса

fetch('/ajax/', {body: FormAdd(pr), method: 'POST'}).then(r => r.json()).then(d => eval(d))

Пользователь в текстовое поле вводит текст, с каждым набранным символом, отправляется запрос на подгрузку схожего контента

Собственно как прервать запрос fetch(),так чтобы не было таких случаев.

Например при удалении:

Удалили строчку длиною 29 символов через delete.
Строчка пуста, а окно схожих запросов по прежнему моргает по мере прихода ответов от сервера.


Ответы (1 шт):

Автор решения: Михаил Ребров

Делается это с помощью AbortController.

// создаем контроллер
let controller = new AbortController();
// через секунду прерываем запрос
setTimeout(() => controller.abort(), 1000);

try {
    fetch( '/ajax/',
        {
            body: FormAdd(pr),
            method: 'POST',
            signal: controller.signal // пробрасываем signal, ответственный за прерывание запроса
        })
        .then(r => r.json())
        .then(d => eval(d));
} catch(err) {
    if (err.name == 'AbortError') { // перехватывает прерывание запроса
        alert("Aborted!");
    } else {
        throw err;
    }
}

Подробнее см:

→ Ссылка