English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'objet XMLHttpRequest est utilisé pour échanger des données avec le serveur.
Tous les navigateurs modernes (Chrome, Firefox, IE7 +Edge, Safari, Opera) ont des objets XMLHttpRequest intégrés.
XMLHttpRequest permet des mises à jour asynchrones de la page web en échangeant des données avec le serveur web en arrière-plan.
Vous pouvez récupérer des données à partir de l'URL sans actualiser toute la page.
Cela permet à la page web de mettre à jour une partie de la page sans interrompre l'opération de l'utilisateur.
Avant d'exécuter la communication AJAX entre le client et le serveur, la première chose à faire est d'instancier un objet XMLHttpRequest, comme suit :
Syntaxe :
var request = new XMLHttpRequest();
var httpRequest = new XMLHttpRequest();Tester voir‹/›
Pour des raisons de sécurité, les navigateurs modernes ne permettent pas l'accès transverse de domaine.
Cela signifie que la page web et le fichier demandé qu'elle tente de charger doivent être situés sur le même serveur.
w3Les exemples sur codebox.com ont tous ouvert des fichiers situés dans w3Tous les fichiers demandés ouverts dans le domaine codebox.com.
Si vous souhaitez utiliser l'exemple ci-dessus sur l'une de vos pages web, le fichier demandé doit être situé sur votre propre serveur.
Les anciennes versions d'Internet Explorer (6Et les versions plus anciennes utilisent des objets ActiveX plutôt que des objets XMLHttpRequest.
Syntaxe :
var request = new ActiveXObject("Microsoft.XMLHTTP");Pour traiter IE6et les versions plus anciennes, veuillez vérifier si le navigateur prend en charge l'objet XMLHttpRequest, sinon créez un objet ActiveX :
var httpRequest;
if (window.XMLHttpRequest) {
// Les navigateurs les plus populaires (Chrome, Mozilla, Safari, IE7+, ...)
httpRequest = new XMLHttpRequest();
else if (window.ActiveXObject) {
// <= IE 6 ou versions IE anciennes
httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}Tester voir‹/›Le tableau suivant liste toutes les propriétés de l'objet XMLHttpRequest :
| Propriété | Description |
|---|---|
| onreadystatechange | Définir la fonction à appeler lorsque l'attribut readyState change |
| readyState | Garder l'état de XMLHttpRequest : 0：requête non initialisée 1：établir la connexion au serveur 2：recevoir la requête 3：traiter la requête 4：la requête est terminée et la réponse est prête |
| responseText | Retourne les données de réponse sous forme de chaîne |
| responseXML | Retourne les données de réponse sous forme de données XML |
| status | Retourne le numéro d'état de la requête : 200："OK" 403："Forbidden" 404："Not Found" Pour une liste complète, veuillez visiterRéférence du code d'état HTTP |
| statusText | Retourne le texte de l'état (par exemple, "OK" ou "Not Found") |
Le tableau suivant liste toutes les méthodes de l'objet XMLHttpRequest :
| Méthode | Description |
|---|---|
| new XMLHttpRequest() | Créer un nouveau objet XMLHttpRequest |
| abort() | Annuler la requête en cours |
| getAllResponseHeaders() | Retourner les informations de titre |
| getResponseHeader() | Retourner des informations spécifiques sur les en-têtes |
| open(method, url, async) | Spécifier la requête method：type de requêteGETouPOST url：emplacement du fichier async：true（asynchrone）ou false（synchronisé） |
| send() | Pour envoyer la requête à UtiliséGETServeur de la requête |
| send(string) | Pour envoyer la requête au serveur. UtiliséPOSTRequête |
| setRequestHeader(header, value) | Définir l'en-tête HTTP de la requête header :Spécifier le nom de l'en-tête value :Spécifier la valeur de l'en-tête |