AbortController
const ac = new AbortController(); fetch(url, { signal: ac.signal }); ac.abort();
Crée un signal qui permet d’interrompre une opération. On le passe comme signal à fetch() ou à addEventListener() ; après l’appel de abort(), l’opération s’arrête.
Les exemples avec fetch() appellent une API d’exemple sur le même site : /api/products renvoie la liste des produits en JSON, /api/products/1 un seul produit (un identifiant inexistant renvoie 404), /api/slow répond au bout de 3 secondes.
Valeur de retour
Un objet avec la propriété signal et la méthode abort(reason).
Exemples
const ac = new AbortController();
setTimeout(() => ac.abort(), 50);
try {
await fetch('/api/slow', { signal: ac.signal });
} catch (e) {
console.log(e.name, ac.signal.aborted);
}
Résultat :
AbortError true
Interrompre la requête précédente quand une nouvelle recherche commence :
let last;
const search = async (query) => {
last?.abort();
last = new AbortController();
try {
const o = await fetch('/api/products?q=' + encodeURIComponent(query), { signal: last.signal });
return `${query} : ${(await o.json()).length} résultats`;
} catch (e) {
return `${query} : ${e.name}`;
}
};
console.log(await Promise.all([search('c'), search('ca'), search('café')]));
Résultat :
[ 'c : AbortError', 'ca : AbortError', 'café : 3 résultats' ]
Points d’attention
- Un fetch interrompu rejette la Promise avec
AbortError– dans le catch, distinguez-le des vraies erreurs. - Un même signal peut concerner plusieurs opérations (il les interrompt toutes).
addEventListener(type, fn, { signal })retire les écouteurs après abort().
Prise en charge par les navigateurs
Baseline – largement disponible : dans tous les navigateurs courants depuis mars 2019, considéré comme largement disponible depuis septembre 2021. Depuis la version : Chrome 66, Firefox 57, Safari 12.1 ; Node.js 14.17.0. État : octobre 2026 (MDN browser-compat-data).
Voir aussi :
AbortSignal.timeout()
fetch()
Promise.race()