Pourquoi votre appel d'API est-il appelé deux fois : Comprendre les requêtes préalables et XHR

Lorsque j'inspecte l'onglet Réseau dans DevTools, je remarque souvent des appels d'API dupliqués avec des types de requête différents, spécifiquement pré-vol et xhr. Ce phénomène est généralement lié à CORS (Partage de ressources cross-origin). XMLHttpRequest (XHR) est l'appel d'API réel qui envoie des requêtes de données du client au serveur. Une requête de pré-vol est une petite requête envoyée par le navigateur pour vérifier si l'API acceptera une requête de l'origine actuelle. Cette requête est généralement une requête OPTIONS qui demande la permission de poursuivre. Si le serveur répond avec les en-têtes Access-Control-Allow-* appropriés, le navigateur envoie l'appel XHR réel. Le navigateur vérifie d'abord si un pré-vol est requis, envoie ensuite la requête OPTIONS si nécessaire, et enfin envoie la requête XHR si la permission est accordée. Si le serveur refuse la permission, la requête XHR est bloquée. Comprendre les requêtes de pré-vol est important pour les QA pour savoir que les appels d'API dupliqués ne sont pas un bug, mais plutôt une fonctionnalité de sécurité. Cela aide également les QA à tester les autorisations CORS et à vérifier les réponses du serveur avec des en-têtes comme Access-Control-Allow-Origin.