JavaScript modifie la valeur de la requête

JavaScript est l'un des langages de programmation les plus puissants pouvant facilement modifier n'importe quel élément de la page. Dans le développement Web, Ajax et XMLHttpRequest sont deux technologies très courantes et largement utilisées dans le développement de sites Web dynamiques.

XMLHttpRequest est une API de navigateur représentée par un objet XMLHttpRequest, qui peut obtenir des données du serveur de manière asynchrone sans actualiser la page.

Voyons comment utiliser JavaScript pour modifier la valeur d'une requête XMLHttpRequest. Tout d’abord, nous devons créer un objet de requête à l’aide de XMLHttpRequest. Supposons que nous souhaitions envoyer une requête POST au serveur. Les données demandées doivent contenir une valeur de formulaire nommée "nom d'utilisateur". Nous pouvons l'écrire comme ceci :

let xhr = new XMLHttpRequest();
xhr.open('POST', 'http://example.com', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
let data = 'username=john';
xhr.send(data);

Dans cet exemple, nous créons un objet XMLHttpRequest et utilisons la méthode open(). spécifie la méthode de transport et l'URL. Le troisième paramètre true indique une requête asynchrone. Ensuite, nous utilisons la méthode setRequestHeader() pour définir l'en-tête de la requête et indiquer au serveur que le type de données demandé est au format formulaire.

Enfin, nous utilisons la méthode send() pour envoyer les données au serveur. Dans cet exemple, nous définissons une valeur de formulaire appelée « nom d'utilisateur » sur « john ». Maintenant, disons que nous devons modifier sa valeur avant d'envoyer la requête. Nous pouvons faire ceci :

let xhr = new XMLHttpRequest();
xhr.open('POST', 'http://example.com', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
let data = 'username=john';
data = data.replace('john', 'smith');
xhr.send(data);

Dans cet exemple, nous utilisons la méthode replace() pour remplacer "john" par "smith" dans les données. Désormais, lorsque nous enverrons la requête, la valeur nommée « nom d'utilisateur » dans les données du formulaire sera « smith ».

JavaScript fournit également un moyen plus simple de modifier les données du formulaire. Nous pouvons utiliser l'objet FormData pour créer un objet formulaire, puis utiliser la méthode set() pour définir la valeur du formulaire. Par exemple, nous pouvons écrire comme ceci :

let xhr = new XMLHttpRequest();
xhr.open('POST', 'http://example.com', true);
let formData = new FormData();
formData.set('username', 'john');
xhr.setRequestHeader('Content-Type', 'multipart/form-data');
formData.set('username', 'smith');
xhr.send(formData);

Dans cet exemple, nous créons un nouvel objet FormData à l'aide du constructeur FormData() et définissons la valeur du formulaire nommée "username" à l'aide de la méthode set(). Nous définissons ensuite l'en-tête de la requête sur multipart/form-data et envoyons la requête. Avant d'envoyer la requête, nous utilisons à nouveau la méthode set() pour modifier la valeur du formulaire en "smith". Après l'envoi de la demande, la valeur nommée « nom d'utilisateur » dans les données du formulaire sera « smith ».

Lorsque vous utilisez XMLHttpRequest pour envoyer une requête, modifier la valeur de la requête est une compétence très utile. Cela peut nous aider à mieux comprendre Ajax et XMLHttpRequest et nous permettre de mieux contrôler les données de nos requêtes. Que ce soit en utilisant la méthode replace() ou l'objet FormData, la valeur de la requête peut être facilement modifiée pour répondre à nos besoins.

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!