Introduction : AJAX et JSON (JavaScript Object Notation) forment un duo incontournable pour les applications web modernes. JSON est un format léger et facile à manipuler, idéal pour échanger des données entre le client et le serveur. Dans cet article, nous explorons comment utiliser AJAX avec JSON pour créer des applications dynamiques.
1. Pourquoi JSON ?
JSON est :
- Facile à lire et à écrire.
- Nativement pris en charge par JavaScript.
- Plus léger que XML, ce qui le rend idéal pour les échanges de données.
2. Exemple : Charger des Données JSON avec AJAX
Voici un exemple simple pour récupérer des données JSON depuis une API :
fetch('https://api.example.com/utilisateurs')
.then(response => response.json())
.then(data => {
data.forEach(utilisateur => {
console.log(`Nom : ${utilisateur.nom}, Email : ${utilisateur.email}`);
});
})
.catch(error => console.error('Erreur :', error));
3. Envoyer des Données JSON avec AJAX
Vous pouvez également envoyer des données JSON au serveur :
fetch('https://api.example.com/utilisateurs', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ nom: 'Jean', email: 'jean@example.com' }),
})
.then(response => response.json())
.then(data => console.log('Utilisateur ajouté :', data))
.catch(error => console.error('Erreur :', error));
Conclusion : JSON, le Compagnon Idéal d'AJAX
Avec JSON, vous pouvez échanger des données de manière simple et efficace, rendant vos applications web plus dynamiques et interactives.
Retour à la liste
Richard Bonnegent
Commentaires (0)