Response : méthode blob()

Baseline Widely available

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis mars 2017.

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

La méthode blob() de l'interface Response prend le flux de la réponse et le lit jusqu'à la fin. Elle retourne une promesse qui est résolue avec un objet Blob.

Note : Si la Response a un Response.type égal à "opaque", le Blob résultant aura une Blob.size de 0 et un Blob.type égal à une chaîne vide "", ce qui le rend inutile pour des méthodes comme URL.createObjectURL().

Valeur de retour

Une promesse qui est résolue avec un objet Blob dont les données sont les octets du corps et le type média est la valeur de l'en-tête Content-Type de la réponse.

Exceptions

AbortError DOMException

La requête a été annulée.

TypeError

Levée pour l'une des raisons suivantes :

Le corps de la réponse est perturbé ou verrouillé.
Une erreur s'est produite lors du décodage du contenu du corps (par exemple, si l'en-tête HTTP Content-Encoding est incorrect).

Exemples

Dans notre exemple de requête de récupération ^(angl.) (voir la requête de récupération en direct ^(angl.)), nous créons une nouvelle requête à l'aide du constructeur Request(), puis nous l'utilisons pour récupérer un fichier JPG. Lorsque la récupération réussit, nous lisons un objet Blob à partir de la réponse avec blob(), nous le plaçons dans une URL d'objet avec URL.createObjectURL(), puis nous définissons cette URL comme source d'un élément HTML <img> pour afficher l'image.

const monImage = document.querySelector("img");

const maRequete = new Request("fleurs.jpg");

fetch(maRequete)
  .then((reponse) => reponse.blob())
  .then((monBlob) => {
    const urlObjet = URL.createObjectURL(monBlob);
    monImage.src = urlObjet;
  });