Response : méthode bytes()
Baseline
2025
Newly available
Depuis January 2025, 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 bytes() 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 Uint8Array.
Syntaxe
bytes()
Paramètres
Aucun.
Valeur de retour
Une promesse qui est résolue avec un objet Uint8Array.
Exceptions
AbortErrorDOMException-
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-Encodingest incorrect).
RangeError-
Levée s'il y a un problème lors de la création de l'objet
ArrayBufferassocié (par exemple, si la taille des données est trop grande).
Exemples
>Récupérer et décoder un fichier
Le code ci-dessous montre comment récupérer un fichier texte, retourner le corps sous forme de Uint8Array, puis le décoder en une chaîne de caractères.
const reponse = await fetch("https://www.exemple.com/textfile.txt");
const fichierTexte = await reponse.bytes();
const chaineDeCaracteres = new TextDecoder().decode(fichierTexte);
console.log(chaineDeCaracteres);
Obtenir la signature d'un fichier image
Cet exemple montre comment utiliser bytes() pour lire les octets de signature de plusieurs fichiers image et identifier leur type.
HTML
Nous définissons d'abord un élément HTML <select> pour choisir le type de fichier, avec des valeurs correspondant à des fichiers spécifiques sur WikiMedia Commons à récupérer.
<label for="file-select">Choisir un fichier :</label>
<select name="Files" id="file-select">
<option value="">--Sélectionner un type d'image--</option>
<option
value="https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png">
PNG
</option>
<option
value="https://upload.wikimedia.org/wikipedia/commons/a/a9/Example.jpg">
JPG
</option>
<option
value="https://upload.wikimedia.org/wikipedia/commons/8/8f/Example.gif">
GIF89a
</option>
</select>
JavaScript
Le code vérifie d'abord si la méthode bytes() est prise en charge.
Si c'est le cas, il ajoute un gestionnaire d'évènement pour l'évènement change sur l'élément <select>.
Lorsque la valeur change, il passe la valeur de la sélection (une URL de fichier image) à la méthode verifierSignature() définie ci-dessous.
Si la méthode n'est pas prise en charge, il l'indique dans le journal.
if ("bytes" in Response.prototype) {
const elementSelectFichier = document.getElementById("file-select");
elementSelectFichier.addEventListener("change", (event) => {
try {
verifierSignature(event.target.value);
} catch (e) {
log(e);
}
});
} else {
log("Response.bytes() n'est pas pris en charge");
}
La méthode verifierSignature() est définie ci-dessous.
Elle récupère un fichier à l'URL donnée, utilise response.bytes() pour obtenir son contenu sous forme de tableau d'octets.
Les premiers octets sont ensuite comparés aux octets de signature de plusieurs types de fichiers courants.
Le nom du fichier et le type de fichier sont ensuite affichés dans le journal.
async function verifierSignature(url) {
if (url === "") return;
log(`Fichier : ${url}`);
const reponse = await fetch(url);
const image = await reponse.bytes();
// Signatures de fichiers depuis : https://en.wikipedia.org/wiki/List_of_file_signatures
const signatureJpg = [0xff, 0xd8, 0xff, 0xe0];
const signaturePng = [0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a];
const signatureGif89a = [0x47, 0x49, 0x46, 0x38, 0x39, 0x61];
if (
image
.slice(0, signatureJpg.length)
.every((octet, index) => octet === signatureJpg[index])
) {
log(`Signature JPG : FF D8 FF E0`);
} else if (
image
.slice(0, signaturePng.length)
.every((octet, index) => octet === signaturePng[index])
) {
log(`Signature PNG : 89 50 4E 47 0D 0A 1A 0A`);
} else if (
image
.slice(0, signatureGif89a.length)
.every((octet, index) => octet === signatureGif89a[index])
) {
log(`Signature GIF (GIF89a) : 47 49 46 38 39 61`);
} else {
log("Format inconnu");
}
}
Résultat
Choisissez un type d'image à l'aide de la liste de sélection. Le journal doit alors afficher le nom du fichier ainsi que le type de fichier déterminé à partir de la signature du fichier.
Spécifications
| Specification |
|---|
| Fetch> # dom-body-bytes> |
Compatibilité des navigateurs
Voir aussi
- L'API ServiceWorker
- Contrôle d'accès HTTP (CORS)
- La référence HTTP