Texte & documents
Nombres & calcul
Données & formats
Sécurité
Développement & DevOps
Intelligence artificielle
Finances
Santé et bien-être
Productivité
Jeux et divertissement
Multimédia & design
Entreprise
Guide d'utilisation
Ce que c'est et à quoi ça sert

CORS (Cross-Origin Resource Sharing) est le mécanisme par lequel un navigateur décide si une page web peut lire la réponse d'une API hébergée sur une autre origine (un autre domaine, port ou protocole). Sans les bons headers CORS, le navigateur bloque la lecture par sécurité. Cet outil simule cette vérification du navigateur : il t'explique, sans faire aucune requête réelle et le tout dans ton navigateur, si ton serveur autoriserait l'appel et pourquoi.

Ce qu'il faut saisir

Remplis trois éléments :

• Origine (navigateur) — l'URL de l'app qui fait la requête (p. ex. https://myapp.com). C'est la valeur que le navigateur enverrait dans le header Origin.
• Méthode HTTP — GET, POST, PUT, DELETE… La méthode détermine si un preflight est nécessaire.
• Headers de réponse du serveur — colle les headers renvoyés par ton API, un par ligne, au format Nom : valeur (p. ex. Access-Control-Allow-Origin: *). L'analyse se met à jour toute seule pendant que tu écris.

Requête simple vs preflight

Il existe deux formes de requête cross-origin :

• Requête simple — avec GET, POST ou HEAD et des en-têtes basiques, le navigateur l'envoie directement puis vérifie si la réponse contient Access-Control-Allow-Origin.
• Avec preflight — avec des méthodes comme PUT, PATCH ou DELETE (ou des en-têtes personnalisés), le navigateur envoie d'abord une requête préalable de type OPTIONS pour demander la permission. L'outil signale automatiquement quand votre méthode nécessite un preflight.

Le preflight (OPTIONS) en détail

Le preflight est une requête OPTIONS que le navigateur envoie avant la vraie pour demander « tu me laisses faire ça ? ». Dans cet outil, il se déclenche avec les méthodes PUT, PATCH, DELETE et OPTIONS. Quand l'avertissement apparaît, ton serveur doit répondre à cet OPTIONS avec les headers CORS appropriés (origine, méthodes et headers autorisés) ; sinon, le navigateur annule la requête réelle même si ton API fonctionne. Ajouter Access-Control-Max-Age évite de répéter le preflight à chaque appel.

Access-Control-Allow-Origin

C'est l'en-tête indispensable : elle indique quelle origine peut lire la réponse.

• * — autorise n'importe quelle origine, mais ne fonctionne pas avec les identifiants (cookies).
• Une origine précise, p. ex. https://myapp.com — seulement cette origine, et elle doit coïncider exactement avec votre Origine (protocole + domaine + port).

Si cet en-tête manque, ou si la valeur ne correspond ni à * ni à votre origine, la requête est bloquée.

Access-Control-Allow-Methods

Liste les méthodes HTTP que le serveur accepte depuis une autre origine, séparées par des virgules (p. ex. GET, POST, PUT, DELETE). Elle est surtout pertinente pour le preflight. Si vous indiquez cet en-tête mais qu'il n'inclut pas votre méthode, l'outil le signale comme un problème et bloque la requête. Si vous ne le mettez pas, la méthode n'est pas vérifiée.

Access-Control-Allow-Headers

Énumère quels en-têtes de requête le client peut envoyer (p. ex. Content-Type, Authorization). Le navigateur l'exige lors du preflight quand votre requête envoie des en-têtes non standard. Si votre app envoie Authorization et qu'il n'apparaît pas ici, le navigateur bloquera l'appel.

Access-Control-Allow-Credentials

Avec la valeur true, permet d'envoyer cookies et identifiants dans la requête cross-origin.

• Attention, piège important : les identifiants sont incompatibles avec Access-Control-Allow-Origin: *. Si vous utilisez des identifiants, l'origine doit être spécifique (p. ex. https://myapp.com), jamais *. Combiner les deux fait que le navigateur rejette la réponse.

Access-Control-Max-Age et Vary

Access-Control-Max-Age indique combien de secondes le navigateur peut mettre en cache la réponse du preflight (p. ex. 86400 = 24 h), pour ne pas répéter l'OPTIONS à chaque appel. L'outil l'inclut dans les en-têtes suggérés quand votre méthode nécessite un preflight. N'oubliez pas d'ajouter aussi Vary: Origin sur votre serveur quand vous renvoyez une origine précise, pour que les caches ne mélangent pas les réponses de différentes origines.

Comment lire le résultat

Après l'analyse tu verras :

• Une bannière verte (autorisé) ou rouge (bloqué) avec la raison exacte : Access-Control-Allow-Origin manque, l'origine ne correspond pas ou la méthode n'est pas autorisée.
• Headers CORS trouvés — chaque header détecté avec sa valeur et une explication.
• Problèmes détectés — ce qui empêche la requête.
• Ça marche, mais c'est un risque de sécurité — ce que le navigateur laisse VRAIMENT passer et que tu ne devrais pas vouloir, comme accepter l'origine null avec des identifiants.
• Ton navigateur le permet, mais ne t'y fie pas — ce que Chrome accepte aujourd'hui et que la spécification ne garantit pas.
• Headers suggérés — un bloc prêt à copier dans la configuration de ton serveur.

CORS ExplainerAnalysez les en-têtes CORS de votre serveur
Explication de CORSAnalysez et expliquez les en-têtes CORS de votre serveur
URL de l'app qui fait la requête

Coche-le si ton code utilise <code>credentials: 'include'</code> (ou <code>withCredentials</code>). Ça change les règles : l'origine ne peut plus être <code>*</code>, les jokers ne comptent plus, et le serveur doit répondre <code>Access-Control-Allow-Credentials: true</code>.

Ceux de la REQUÊTE, pas ceux de la réponse. Ce sont eux qui décident si le navigateur envoie d'abord un OPTIONS, et ceux que « Access-Control-Allow-Headers » doit couvrir.

CORS permitido correctamente
Le navigateur enverra d'abord une requête OPTIONS (preflight), à cause de le Content-Type application/json. Ton serveur doit aussi répondre à CETTE requête OPTIONS, pas seulement à la requête réelle.

En-têtes CORS trouvés

Access-Control-Allow-Originhttps://myapp.comPermite solo el origen: https://myapp.com
Access-Control-Allow-MethodsPOSTMétodos permitidos: POST
Access-Control-Allow-HeadersContent-TypeCabeceras permitidas en la petición: Content-Type

En-têtes suggérés pour votre serveur

Access-Control-Allow-Origin: https://myapp.com
Vary: Origin
Access-Control-Allow-Methods: POST
Access-Control-Allow-Headers: Content-Type
Access-Control-Max-Age: 86400
Ceci se décide à partir des en-têtes que tu colles, sans sortir sur le réseau — d'où l'intérêt aussi pour une API locale ou privée. Si tu veux vraiment envoyer la requête et voir si ton serveur a répondu, il y a le Atelier d'API.