Dans cet article
Qu'est-ce que CORS ?
Le partage de ressources entre origines (CORS) est un mecanisme de securite du navigateur qui controle quelles origines web peuvent acceder aux ressources de votre serveur. Par defaut, les navigateurs appliquent la politique de meme origine, bloquant les requetes JavaScript vers un domaine, port ou protocole different.
Les en-tetes CORS indiquent au navigateur quelles requetes inter-origines autoriser. Sans les bons en-tetes, les appels API d'un frontend sur un domaine vers un backend sur un autre echoueront avec une erreur CORS. Un generateur d'en-tetes CORS cree les en-tetes Access-Control-Allow-* corrects.
Comment fonctionnent les en-tetes CORS
CORS fonctionne via un ensemble d'en-tetes de reponse HTTP que le serveur envoie pour indiquer quelles origines, methodes et en-tetes sont autorises.
- Access-Control-Allow-Origin — specifie quelles origines peuvent acceder a la ressource (un domaine specifique ou * pour toute origine)
- Requetes preflight — pour les requetes non simples, les navigateurs envoient d'abord une requete OPTIONS pour verifier si la requete reelle est autorisee
- Gestion des identifiants — Access-Control-Allow-Credentials: true autorise les cookies et en-tetes d'authentification, mais requiert une origine specifique
Essayez gratuitement — sans inscription
Generer des en-tetes CORS →Quand configurer CORS
La configuration CORS est necessaire chaque fois que votre frontend et backend sont servis depuis des origines differentes.
- Developpement API — les API REST ou GraphQL accessibles par des apps frontend sur differents domaines necessitent des en-tetes CORS
- Configuration CDN — servir des ressources statiques depuis un sous-domaine CDN necessite CORS pour les fichiers de polices et requetes API
- Microservices — les services fonctionnant sur differents ports en developpement local necessitent CORS pour communiquer via le navigateur
Foire aux questions
Pourquoi ne pas simplement utiliser Access-Control-Allow-Origin: * partout ?
Le joker * autorise toute origine, ce qui convient aux API publiques. Cependant, il ne peut pas etre utilise avec les identifiants (cookies, en-tetes Authorization). Si votre API necessite une authentification, vous devez specifier l'origine exacte.
Qu'est-ce qu'une requete preflight ?
Un preflight est une requete HTTP OPTIONS que le navigateur envoie automatiquement avant la requete reelle. Il verifie si le serveur autorise la methode, les en-tetes et l'origine. Le preflight se produit pour les requetes avec des en-tetes personnalises ou des methodes autres que GET/POST/HEAD.
Comment corriger l'erreur 'No Access-Control-Allow-Origin header' ?
Ajoutez l'en-tete Access-Control-Allow-Origin a la reponse de votre serveur avec le domaine de l'origine demandeuse. Pour Express utilisez le middleware cors, pour Nginx ajoutez des directives add_header, pour Apache utilisez Header set.