diff options
Diffstat (limited to 'files/fr/web/api/blob/index.md')
| -rw-r--r-- | files/fr/web/api/blob/index.md | 130 |
1 files changed, 55 insertions, 75 deletions
diff --git a/files/fr/web/api/blob/index.md b/files/fr/web/api/blob/index.md index 6cf6467846..3e79c90f0f 100644 --- a/files/fr/web/api/blob/index.md +++ b/files/fr/web/api/blob/index.md @@ -7,61 +7,52 @@ tags: - WebAPI translation_of: Web/API/Blob --- -<div>{{APIRef("File API")}}</div> +{{APIRef("File API")}} -<p>Un objet <strong><code>Blob</code></strong> représente un objet, semblable à un fichier, qui est immuable et qui contient des données brutes. Les <em>blobs</em> (pour <em><strong>B</strong>inary <strong>L</strong>arge <strong>Ob</strong>jects</em>) représentent des données qui ne sont pas dans un format JavaScript natif. L'interface {{domxref("File")}} est basée sur l'interface <code>Blob</code> et hérite des fonctionnalités de cette dernière tout en ajoutant des fonctionnalités pour gérer les fichiers sur le système de l'utilisateur.</p> +Un objet **`Blob`** représente un objet, semblable à un fichier, qui est immuable et qui contient des données brutes. Les _blobs_ (pour **\*B**inary **L**arge **Ob**jects\*) représentent des données qui ne sont pas dans un format JavaScript natif. L'interface {{domxref("File")}} est basée sur l'interface `Blob` et hérite des fonctionnalités de cette dernière tout en ajoutant des fonctionnalités pour gérer les fichiers sur le système de l'utilisateur. -<p>Pour construire un <code>Blob</code> à partir d'objets qui ne sont pas des blobs ou à partir d'autres données, on pourra utiliser le constructeur {{domxref("Blob.Blob", "Blob()")}}. Pour créer un blob qui contient un sous-ensemble d'un autre blob, on pourra employer la méthode {{domxref("Blob.slice()", "slice()")}}. Pour obtenir un <code>Blob</code> à partir d'un fichier du système de l'utilisateur, consulter la documentation {{domxref("File")}}.</p> +Pour construire un `Blob` à partir d'objets qui ne sont pas des blobs ou à partir d'autres données, on pourra utiliser le constructeur {{domxref("Blob.Blob", "Blob()")}}. Pour créer un blob qui contient un sous-ensemble d'un autre blob, on pourra employer la méthode {{domxref("Blob.slice()", "slice()")}}. Pour obtenir un `Blob` à partir d'un fichier du système de l'utilisateur, consulter la documentation {{domxref("File")}}. -<p>Les API qui acceptent des objets <code>Blob</code> sont également listées sur la documentation de {{domxref("File")}}.</p> +Les API qui acceptent des objets `Blob` sont également listées sur la documentation de {{domxref("File")}}. -<div class="note"> -<p><strong>Note :</strong> La méthode <code>slice()</code> utilisait auparavant un deuxième argument qui indiquait le nombre d'octets à copier dans le nouveau blob. Si on utilisait un couple de valeur <code>début + longueur</code> qui dépassait la taille du blob source, le blob qui était renvoyé contenait les données à partir de l'indice de début et jusuq'à la fin du blob.</p> -</div> +> **Note :** La méthode `slice()` utilisait auparavant un deuxième argument qui indiquait le nombre d'octets à copier dans le nouveau blob. Si on utilisait un couple de valeur `début + longueur` qui dépassait la taille du blob source, le blob qui était renvoyé contenait les données à partir de l'indice de début et jusuq'à la fin du blob. -<div class="note"> - <p><strong>Note :</strong> La méthode <code>slice()</code> doit être utilisée avec certains préfixes sur certaines versions de navigateurs : <code>blob.mozSlice()</code> pour Firefox 12 et antérieur, <code>blob.webkitSlice()</code> dans Safari. Un ancienne version de <code>slice()</code> sans préfixes avait une sémantique différente et est désormais obsolète. La prise en charge de <code>blob.mozSlice()</code> a été abandonnée avec Firefox 30.</p> -</div> +> **Note :** La méthode `slice()` doit être utilisée avec certains préfixes sur certaines versions de navigateurs : `blob.mozSlice()` pour Firefox 12 et antérieur, `blob.webkitSlice()` dans Safari. Un ancienne version de `slice()` sans préfixes avait une sémantique différente et est désormais obsolète. La prise en charge de `blob.mozSlice()` a été abandonnée avec Firefox 30. -<h2 id="Constructeur">Constructeur</h2> +## Constructeur -<dl> - <dt>{{domxref("Blob.Blob", "Blob(blobParts[, options])")}}</dt> - <dd>Ce constructeur renvoie un nouvel objet <code>Blob</code> qui contient la concaténation des valeurs du tableau passé en paramètre.</dd> -</dl> +- {{domxref("Blob.Blob", "Blob(blobParts[, options])")}} + - : Ce constructeur renvoie un nouvel objet `Blob` qui contient la concaténation des valeurs du tableau passé en paramètre. -<h2 id="Propriétés">Propriétés</h2> +## Propriétés -<dl> - <dt>{{domxref("Blob.isClosed")}} {{readonlyinline}} {{experimental_inline}}</dt> - <dd>Un booléen qui indique si la méthode {{domxref("Blob.close()")}} a été appelée sur le blob. Les blobs qui ont été fermés ne peuvent pas être lus.</dd> - <dt>{{domxref("Blob.size")}} {{readonlyinline}}</dt> - <dd>La taille des données contenues dans l'objet <code>Blob</code>, exprimée en octets.</dd> - <dt>{{domxref("Blob.type")}} {{readonlyinline}}</dt> - <dd>Une chaîne de caractères qui indique le type MIME des données contenues dans le <code>Blob</code>. Si le type est inconnu, la chaîne de caractères est vide.</dd> -</dl> +- {{domxref("Blob.isClosed")}} {{readonlyinline}} {{experimental_inline}} + - : Un booléen qui indique si la méthode {{domxref("Blob.close()")}} a été appelée sur le blob. Les blobs qui ont été fermés ne peuvent pas être lus. +- {{domxref("Blob.size")}} {{readonlyinline}} + - : La taille des données contenues dans l'objet `Blob`, exprimée en octets. +- {{domxref("Blob.type")}} {{readonlyinline}} + - : Une chaîne de caractères qui indique le type MIME des données contenues dans le `Blob`. Si le type est inconnu, la chaîne de caractères est vide. -<h2 id="Méthodes">Méthodes</h2> +## Méthodes -<dl> - <dt>{{domxref("Blob.close()")}} {{experimental_inline}}</dt> - <dd>Cette méthode clotûre le blob et libère éventuellement les ressources sous-jacentes.</dd> - <dt>{{domxref("Blob.slice()", "Blob.slice([début[, fin[, contentType]]])")}}</dt> - <dd>Cette méthode renvoie un nouvel objet <code>Blob</code> qui contient les données dans le fragment du <code>Blob</code> source entre <code>début</code> et <code>fin</code>.</dd> -</dl> +- {{domxref("Blob.close()")}} {{experimental_inline}} + - : Cette méthode clotûre le blob et libère éventuellement les ressources sous-jacentes. +- {{domxref("Blob.slice()", "Blob.slice([début[, fin[, contentType]]])")}} + - : Cette méthode renvoie un nouvel objet `Blob` qui contient les données dans le fragment du `Blob` source entre `début` et `fin`. -<h2 id="Exemples">Exemples</h2> +## Exemples -<h3 id="Utilisation_du_constructeur_Blob">Utilisation du constructeur <code>Blob</code></h3> +### Utilisation du constructeur `Blob` -<p>Le constructeur {{domxref("Blob.Blob", "Blob()")}} permet de créer des blobs à partir d'autres objets. Par exemple, on peut construire un blob à partir d'une chaîne de caractères :</p> +Le constructeur {{domxref("Blob.Blob", "Blob()")}} permet de créer des blobs à partir d'autres objets. Par exemple, on peut construire un blob à partir d'une chaîne de caractères : -<pre>var debug = {coucou: "monde"}; -var blob = new Blob([JSON.stringify(debug, null, 2)], {type : 'application/json'});</pre> + var debug = {coucou: "monde"}; + var blob = new Blob([JSON.stringify(debug, null, 2)], {type : 'application/json'}); -<h3 id="Créer_une_URL_de_données_vers_un_tableau_typé">Créer une URL de données vers un tableau typé</h3> +### Créer une URL de données vers un tableau typé -<pre class="brush: js">var typedArray = GetTheTypedArraySomehow(); +```js +var typedArray = GetTheTypedArraySomehow(); // On ajoute un type MIME pertinent var blob = new Blob([typedArray], {type: 'application/octet-binary'}); @@ -73,47 +64,36 @@ var url = URL.createObjectURL(blob); // désormais on peut utiliser l'URL dans tout // contexte qui utilise des URL (img.src par // exemple) -</pre> +``` -<h3 id="Extraire_des_données_à_partir_d'un_blob">Extraire des données à partir d'un blob</h3> +### Extraire des données à partir d'un blob -<p>La seule façon de lire le contenu d'un blob est d'utiliser un objet {{domxref("FileReader")}}. Dans le code qui suit, on lit le contenu d'un blob sous la forme d'un tableau typé.</p> +La seule façon de lire le contenu d'un blob est d'utiliser un objet {{domxref("FileReader")}}. Dans le code qui suit, on lit le contenu d'un blob sous la forme d'un tableau typé. -<pre class="brush: js">var reader = new FileReader(); +```js +var reader = new FileReader(); reader.addEventListener("loadend", function() { // reader.result contient le contenu du // blob sous la forme d'un tableau typé }); -reader.readAsArrayBuffer(blob);</pre> - -<p>En utilisant d'autres méthodes de {{domxref("FileReader")}}, on peut lire le contenu du blob si c'est une chaîne ou une URL de données.</p> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaires</th> - </tr> - <tr> - <td>{{SpecName('File API','#blob','Blob')}}</td> - <td>{{Spec2('File API')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Blob")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li>{{domxref("BlobBuilder")}}</li> - <li>{{domxref("File")}}</li> - <li>{{domxref("URL.createObjectURL")}}</li> - <li><a href="/fr/docs/Mozilla/Tech/XPCOM/Language_Bindings/Components.utils.importGlobalProperties">Components.utils.importGlobalProperties</a></li> -</ul> +reader.readAsArrayBuffer(blob); +``` + +En utilisant d'autres méthodes de {{domxref("FileReader")}}, on peut lire le contenu du blob si c'est une chaîne ou une URL de données. + +## Spécifications + +| Spécification | État | Commentaires | +| ---------------------------------------------------- | ---------------------------- | -------------------- | +| {{SpecName('File API','#blob','Blob')}} | {{Spec2('File API')}} | Définition initiale. | + +## Compatibilité des navigateurs + +{{Compat("api.Blob")}} + +## Voir aussi + +- {{domxref("BlobBuilder")}} +- {{domxref("File")}} +- {{domxref("URL.createObjectURL")}} +- [Components.utils.importGlobalProperties](/fr/docs/Mozilla/Tech/XPCOM/Language_Bindings/Components.utils.importGlobalProperties) |