Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

L'interface AbortSignal représente un objet signal qui vous permet de communiquer avec une requête DOM (telle que Fetch) et de l'annuler si nécessaire par un objet AbortController.

Propriétés

L'interface AbortSignal hérite des propriétés de son interface parent EventTarget.

AbortSignal.aborted Lecture seule
Un Boolean (booléen) qui indique si les requêtes avec lesquelles le signal communique sont annulées (true) ou non (false).

Gestionnaire d'évènement

AbortSignal.onabort
appelé quand un évènement abort est lancé, c'est-à-dire quand les requêtes DOM avec lesquelles le signal communique sont annulées.

Méthodes

L'interface AbortSignal hérite des méthodes de son interface parent EventTarget.

Exemples

Dans l'extrait suivant, nous visons à télécharger une vidéo en utilisant l'API Fetch.

Tout d'abord, nous créons un contrôleur en utilisant le constructeur AbortController(), puis nous saisissons une référence associée à son objet AbortSignal au moyen de la propriété AbortController.signal.

Lorsque la  requête fetch (extraction) est lancée, nous transmettons le paramètre AbortSignal en tant qu'option dans l'objet d'options de la requête (voir {signal} ci-dessous). Cela associe le signal et le contrôleur à la requête d'extraction et nous permet de l'annuler en appelant AbortController.abort(), comme indiqué ci-dessous dans le second écouteur d'événements.

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('Download aborted');
});

function fetchVideo() {
  ...
  fetch(url, {signal}).then(function(response) {
    ...
  }).catch(function(e) {
    reports.textContent = 'Download error: ' + e.message;
  })
}

Note : Lorsque abort() est appelé, la réponse fetch() rejette avec une erreur AbortError.

vous pouvez trouver un exemple de travail complet sur GitHub — voir abort-api (voyez-le tourner en direct également).

Spécifications

Spécification Status Comment
DOM
La définition de 'AbortSignal' dans cette spécification.
Standard évolutif Définition initiale

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidEdge MobileFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung Internet
Support simple
Expérimentale
Chrome Support complet 66Edge Support complet 16Firefox Support complet 57IE Aucun support NonOpera Support complet 53Safari Support complet 11.1WebView Android Support complet 66Chrome Android Support complet 66Edge Mobile Support complet 16Firefox Android Support complet 57Opera Android Support complet 53Safari iOS Support complet 11.1Samsung Internet Android Aucun support Non
aborted
Expérimentale
Chrome Support complet 66Edge Support complet 16Firefox Support complet 57IE Aucun support NonOpera Support complet 53Safari Support complet 11.1WebView Android Support complet 66Chrome Android Support complet 66Edge Mobile Support complet 16Firefox Android Support complet 57Opera Android Support complet 53Safari iOS Support complet 11.1Samsung Internet Android Aucun support Non
onabort
Expérimentale
Chrome Support complet 66Edge Support complet 16Firefox Support complet 57IE Aucun support NonOpera Support complet 53Safari Support complet 11.1WebView Android Support complet 66Chrome Android Support complet 66Edge Mobile Support complet 16Firefox Android Support complet 57Opera Android Support complet 53Safari iOS Support complet 11.1Samsung Internet Android Aucun support Non

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.

Voir aussi

Étiquettes et contributeurs liés au document

Contributeurs à cette page : loella16
Dernière mise à jour par : loella16,