From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/fr/web/api/body/json/index.html | 86 +++++++++++++++++++++++++++++++++++ 1 file changed, 86 insertions(+) create mode 100644 files/fr/web/api/body/json/index.html (limited to 'files/fr/web/api/body/json') diff --git a/files/fr/web/api/body/json/index.html b/files/fr/web/api/body/json/index.html new file mode 100644 index 0000000000..121768d6ea --- /dev/null +++ b/files/fr/web/api/body/json/index.html @@ -0,0 +1,86 @@ +--- +title: Body.json() +slug: Web/API/Body/json +tags: + - API + - BODY + - Experimental + - Fetch + - JSON + - Méthode + - Reference +translation_of: Web/API/Body/json +--- +
{{APIRef("Fetch")}}
+ +

La méthode json() de {{domxref("Body")}} lit un Stream {{domxref("Response")}} jusqu'au bout. Elle retourne une promesse qui s'auto-résout en renvoyant le corps de la requête parsée au format {{jsxref("JSON")}}.

+ +

Syntaxe

+ +
response.json().then(function(data) {
+  // faire quelque chose avec les données
+});
+ +

Paramètres

+ +

Aucun.

+ +

Valeur de retour

+ +

Une promesse résolue contenant le corps de la requête (au format JSON) converti sous la forme d'un objet JavaScript. Cet objet peut correspondre à n'importe quel contenu représentable dans le format JSON -- un objet, un tableau, une chaîne de caractère, un nombre…

+ +

Exemple

+ +

Dans l'exemple fetch json (lancer cet exemple), nous créons une nouvelle requête en utilisant le constructeur {{domxref("Request.Request", "Request()")}}, puis utilisons celle-ci pour récupérer un fichier .json. Lorsque l'appel à fetch réussit, on lit les données et on les parse en utilisant json() pour les convertir en un objet JS, puis enfin on utilise les valeurs de l'objet obtenu pour les insérer dans une liste de noeuds, de manière à afficher nos produits. 

+ +
const myList = document.querySelector('ul');
+const myRequest = new Request('products.json');
+
+fetch(myRequest)
+  .then(response => response.json())
+  .then(data => {
+    for (const product of data.products) {
+      let listItem = document.createElement('li');
+      listItem.appendChild(
+        document.createElement('strong')
+      ).textContent = product.Name;
+      listItem.append(
+        ` can be found in ${
+          product.Location
+        }. Cost: `
+      );
+      listItem.appendChild(
+        document.createElement('strong')
+      ).textContent = `£${product.Price}`;
+      myList.appendChild(listItem);
+    }
+  });
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatusComment
{{SpecName('Fetch','#dom-body-json','Body.json()')}}{{Spec2('Fetch')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.Body.json")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf