Maison > interface Web > js tutoriel > Comment puis-je simuler une requête POST en JavaScript comme une soumission de formulaire ?

Comment puis-je simuler une requête POST en JavaScript comme une soumission de formulaire ?

Mary-Kate Olsen
Libérer: 2024-12-18 15:29:11
original
204 Les gens l'ont consulté

How Can I Simulate a POST Request in JavaScript Like a Form Submission?

Requête POST en JavaScript comme soumission de formulaire

Cherchant à rediriger un navigateur vers une page différente, une requête GET peut être utilisée, comme dans l'exemple ci-dessous :

document.location.href = 'http://example.com/q=a';
Copier après la connexion

Cependant, pour les ressources qui nécessitent une requête POST, une approche différente est nécessaire. Le HTML peut être utilisé pour les soumissions statiques, comme indiqué :

<form action="http://example.com/" method="POST">
    <input type="hidden" name="q" value="a">
</form>
Copier après la connexion

D'un autre côté, une solution JavaScript est préférable pour les soumissions dynamiques :

post_to_url('http://example.com/', {'q':'a'});
Copier après la connexion

La compatibilité entre navigateurs nécessite une analyse complète mise en œuvre. Le code suivant fournit une solution simple :

/**
 * sends a request to the specified url from a form. this will change the window location.
 * @param {string} path the path to send the post request to
 * @param {object} params the parameters to add to the url
 * @param {string} [method=post] the method to use on the form
 */

function post(path, params, method='post') {

  // The rest of this code assumes you are not using a library.
  // It can be made less verbose if you use one.
  const form = document.createElement('form');
  form.method = method;
  form.action = path;

  for (const key in params) {
    if (params.hasOwnProperty(key)) {
      const hiddenField = document.createElement('input');
      hiddenField.type = 'hidden';
      hiddenField.name = key;
      hiddenField.value = params[key];

      form.appendChild(hiddenField);
    }
  }

  document.body.appendChild(form);
  form.submit();
}
Copier après la connexion

Exemple d'utilisation :

post('/contact/', {name: 'Johnny Bravo'});
Copier après la connexion

Cette méthode garantit que l'emplacement du navigateur change, simulant la soumission d'un formulaire. Notez que la vérification hasOwnProperty a été ajoutée pour éviter les bugs accidentels.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal