Générer des appels AJAX
Générer des appels AJAX
-
Objectifs
- ِConnaître les méthodes utilisées pour envoyer une requête avec données de formulaire et Json
-
Présentation
- XMLHttpRequest permet d’envoyer des requêtes HTTP de manière très simple. Il suffit de créer une instance de l’objet, d’ouvrir une URL, et d’envoyer la requête.
- Le status HTTP du résultat, tout comme le contenu de la réponse, sont disponibles dans l’objet de la requête quand la transaction est terminée.
- XMLHttpRequest permet de générer des requêtes HTTP vers une URL de manière synchrone ou asynchrone. Pour cela, il faut :
- instancier un objet XMLHttpRequest,
- ouvrir l’url en spécifiant la méthode (GET, POST, DELETE, PUT, HEAD, OPTIONS,…),
- ajouter des entêtes HTTP (facultatif),
- envoyer la requête.
- Le résultat de cet envoi contient, entre autres:
- le statut de la réponse HTTP (200 OK, 404 not found, …),
- les entêtes HTTP,
- le corps de la requête.
- Le troisième paramètre de la méthode open() est le booléen qui indique si la requête doit être effectuée de manière asynchrone (true, par défaut) ou synchrone (si false). L’exécution de requêtes synchrones doit être évitée car cela risque d’empêcher toute interaction de l’utilisateur avec le navigateur.
-
Envoi d’une requête avec données de formulaire
-
Selon la méthode GET
- Les données encodées URI sont ajoutées à l’URL après « ? »:
request.open("GET", "getStudents.php?nom=Dupont&prenom=Arthur");-
Selon la méthode POST
- Les données sont placées dans le corps de la requête:
-
envoi de données de formulaire
request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");request.send(nom1=valeur1&nom2=valeur2&…); // avec caractères spéciaux en \unicode-
si envoi de données au format JSON
request.setRequestHeader("Content-Type", "application/json");request.send(JSON.stringify(data));
