AbortSignal : méthode statique any()

Baseline 2024

Newly available

Depuis ⁨March 2024⁩, cette fonctionnalité fonctionne sur les appareils et les versions de navigateur les plus récents. Elle peut ne pas fonctionner sur les appareils ou navigateurs plus anciens.

Note : Cette fonctionnalité est disponible via les Web Workers.

La méthode statique any() de l'interface AbortSignal prend un itérable de signaux d'annulation et retourne un objet AbortSignal. Le signal d'annulation retourné est annulé dès qu'un des signaux d'entrée de l'itérable est annulé. La raison d'annulation sera définie sur la raison du premier signal annulé. Si l'un des signaux donnés est déjà annulé, le AbortSignal retourné le sera aussi.

Syntaxe

AbortSignal.any(iterable)

Paramètres

iterable: Un itérable (comme un Array) de signaux d'annulation.

Valeur de retour

Un objet AbortSignal qui est :

Déjà annulé, si l'un des signaux donnés est déjà annulé. La raison du AbortSignal retourné sera déjà définie sur la reason du premier signal déjà annulé.
Annulé de façon asynchrone, quand un signal d'annulation de l'iterable est annulé. La reason sera définie sur la raison du premier signal annulé.

Exemples

Utiliser `AbortSignal.any()`

Cet exemple montre comment combiner à la fois un signal provenant d'un AbortController et un signal de délai d'expiration provenant de AbortSignal.timeout.

const cancelDownloadButton = document.getElementById("cancelDownloadButton");

const userCancelController = new AbortController();

cancelDownloadButton.addEventListener("click", () => {
  userCancelController.abort();
});

// Délai d'attente après 5 minutes
const timeoutSignal = AbortSignal.timeout(1_000 * 60 * 5);

// Ce signal sera annulé soit lorsque l'utilisateur·ice clique sur le bouton d'annulation, soit après 5 minutes
// selon ce qui arrive en premier
const combinedSignal = AbortSignal.any([
  userCancelController.signal,
  timeoutSignal,
]);

try {
  const res = await fetch(someUrlToDownload, {
    // Arrête le fetch dès qu'un des signaux est annulé
    signal: combinedSignal,
  });
  const body = await res.blob();
  // Traite le contenu téléchargé :
  // …
} catch (e) {
  if (e.name === "AbortError") {
    // Annulé par l'utilisateur·ice
  } else if (e.name === "TimeoutError") {
    // Affiche à l'utilisateur·ice que le téléchargement a expiré
  } else {
    // Autre erreur, par exemple une erreur réseau
  }
}