Comment envoyer des données de formulaire au format JSON ?

Comment envoyer des données de formulaire sous forme d'objet JSON

Lors de la création de formulaires HTML, il est souvent nécessaire d'envoyer des données dans un format structuré tel que JSON . Pour faciliter cela, explorons comment convertir les données de formulaire en un objet JSON et les transmettre au serveur.

Convertir les données de formulaire en JSON (côté client)

Pour convertir les données du formulaire en un objet JSON :

1. Récupérez les données du formulaire à l'aide de l'objet FormData de JavaScript (par exemple, const formData = new FormData(form)).
2. Parcourez les éléments du formulaire. et extrayez leurs valeurs dans un objet JSON (par exemple, laissez json = JSON.stringify(formData.entries())).

Exemple :

< ;pre>

Définition des en-têtes et envoi de JSON au serveur (côté serveur )

Une fois que vous avez la chaîne JSON, vous pouvez l'envoyer au serveur en utilisant XMLHttpRequest ou toute autre méthode de requête réseau préférée. N'oubliez pas de définir les en-têtes appropriés pour les données JSON :

<br>xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');<br>&lt ;/pre></p>
<p><strong>Exemple (utilisation de XMLHttpRequest) :</strong></p>
<p><pre class="brush:php;toolbar:false"><br>const xhr = new XMLHttpRequest();<br>xhr.open( "POST", "myUrl", true);<br>xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');<br>xhr.send(json);<br> 

Gestion des données JSON reçues sur le serveur

Côté serveur, vous pouvez analyser les données reçues en tant qu'objet JSON et accéder à ses propriétés en conséquence.

Exemple (utilisation de Node.js) :

<br>const body = request.body.toString();<br>const data = JSON.parse(body);</p>
<p>console.log(data.first_name);<br>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!