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
Mary-Kate Olsenoriginal
2024-12-16 20:01:10799parcourir

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);
  });

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!

Déclaration:
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