Maison > interface Web > js tutoriel > Comment puis-je effectuer des requêtes POST inter-domaines en JavaScript à l'aide de CORS ?

Comment puis-je effectuer des requêtes POST inter-domaines en JavaScript à l'aide de CORS ?

Mary-Kate Olsen
Libérer: 2024-12-16 20:01:10
original
747 Les gens l'ont consulté

How Can I Make Cross-Domain POST Requests in JavaScript using CORS?

Envoi de requêtes POST inter-domaines via JavaScript

Les requêtes inter-domaines sont un défi courant dans le développement Web. En JavaScript, il existe plusieurs façons d'envoyer une requête POST inter-domaines, mais l'une des méthodes les plus simples consiste à tirer parti de la norme « Cross-Origin Resource Sharing » (CORS).

Configuration CORS sur le Serveur

Activer CORS sur le serveur qui recevra la requête POST par :

  1. Ajout des en-têtes de réponse suivants :

    • Access-Control-Allow-Origin : from.com (remplacez from.com par l'origine du demande)
    • Access-Control-Allow-Methods : POST
    • Access-Control-Max-Age : 1000
    • Access-Control-Allow-Headers : Content-Type, Authorization, X-Requested-With

POST inter-domaines via JavaScript

En JavaScript, vous pouvez utiliser l'API fetch pour envoyer un POST inter-domaines request :

fetch('https://to.com/postHere.php', {
  method: 'POST',
  mode: 'cors',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ some: 'json' })
})
  .then(response => response.json())
  .then(responseData => {
    console.log(responseData.someKey);
  })
  .catch(error => {
    console.error('POST failed', error);
  });
Copier après la connexion

Ce code effectue une requête POST à ​​https://to.com/postHere.php depuis une origine différente (from.com). Il définit les en-têtes nécessaires pour CORS et chaîne le corps de la requête au format JSON.

Gestion des requêtes OPTIONS

Lorsqu'un client envoie une requête POST inter-domaines, le navigateur commence par envoie une requête OPTIONS au serveur pour vérifier si le serveur prend en charge la requête. Le serveur doit répondre à cette requête avec les en-têtes CORS appropriés pour indiquer que la requête POST est autorisée.

Considérations

  • Cette méthode nécessite la prise en charge de CORS sur le serveur.
  • La requête fera deux requêtes au serveur : une requête OPTIONS suivie du POST demande.
  • CORS peut ne pas fonctionner sur tous les appareils, en particulier les appareils mobiles.

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