Testeur CORS
Testez et diagnostiquez les en-têtes Cross-Origin Resource Sharing (CORS) pour n'importe quelle URL
Exemples d'URL à tester
Comprendre CORS
Qu'est-ce que CORS ?
Cross-Origin Resource Sharing (CORS) est un mécanisme de sécurité qui permet à une page web d'une origine de demander des ressources à une origine différente. Sans CORS, les navigateurs bloquent par défaut ces requêtes inter-origines pour prévenir les vulnérabilités de sécurité.
Comment fonctionne CORS
Lorsqu'un navigateur effectue une requête inter-origines, il envoie un en-tête Origin. Le serveur doit répondre avec l'en-tête Access-Control-Allow-Origin approprié. Pour les requêtes non simples, le navigateur envoie d'abord une requête preflight OPTIONS afin de vérifier si la requête réelle est autorisée.
En-têtes CORS clés
Access-Control-Allow-Origin spécifie les origines autorisées. Access-Control-Allow-Methods liste les méthodes HTTP autorisées. Access-Control-Allow-Headers définit les en-têtes de requête autorisés. Access-Control-Allow-Credentials indique si les cookies sont permis.
Déboguer les erreurs CORS
Les erreurs CORS apparaissent dans la console du navigateur lorsqu'une requête inter-origines est bloquée. Vérifiez que le serveur inclut les en-têtes CORS corrects. Pour les API, assurez-vous que le serveur autorise votre origine, les méthodes requises et tout en-tête personnalisé envoyé.
Testeur CORS
Testez et diagnostiquez les en-têtes Cross-Origin Resource Sharing (CORS) pour n'importe quelle URL
Fonctionnalités
- Send real HTTP requests to a target URL and inspect CORS-related headers in the response
- Reports Access-Control-Allow-Origin, Allow-Methods, Allow-Headers, Allow-Credentials, Max-Age
- Tests preflight (OPTIONS) and actual-request behaviour
- Runs in your browser — your request is sent FROM your origin, so the result reflects what your real app would see
- Useful for debugging CORS-blocked production fetches
Mode d'emploi
- Saisissez l'URL que vous souhaitez tester dans le champ de saisie ou sélectionnez l'une des URL d'exemple fournies pour des tests rapides.
- Choisissez la méthode HTTP (GET, POST, etc.) et ajoutez éventuellement des en-têtes personnalisés dans la section des options avancées.
- Cliquez sur « Tester CORS » pour envoyer une requête inter-origines et consulter les résultats détaillés, y compris tous les en-têtes CORS et leurs valeurs.
Conseils et bonnes pratiques
- Each test sends a real HTTPS request to the target URL — the URL and your IP are visible to the target server.
- CORS is enforced by the browser, not the server. The server sends headers; the browser decides whether to expose the response to JS.
- For wildcard ACAO (`Access-Control-Allow-Origin: *`), the request will succeed but credentials (cookies) won't be sent — that's the spec.
- Preflight (OPTIONS) is sent only for non-simple requests (custom headers, non-GET/POST methods, JSON body in some cases).
- If the test fails, check the browser devtools Network tab — the actual error message is more detailed than this tool can surface.
FAQ
Qu'est-ce que CORS et pourquoi est-ce important pour les développeurs web ?
CORS (Cross-Origin Resource Sharing) est une fonctionnalité de sécurité du navigateur qui contrôle quelles pages web peuvent faire des requêtes vers un domaine différent de celui qui a servi la page. Cela compte parce que les applications web modernes ont fréquemment besoin d'appeler des API sur différents domaines, et sans configuration CORS appropriée, ces requêtes seront bloquées par le navigateur. Comprendre CORS est essentiel pour créer des applications qui interagissent avec des API tierces ou des microservices.
Pourquoi est-ce que j'obtiens une erreur CORS alors que l'API fonctionne dans Postman ou curl ?
CORS est une politique de sécurité appliquée par le navigateur, et non une restriction côté serveur. Des outils comme Postman et curl contournent entièrement CORS car ce ne sont pas des navigateurs et ils n'appliquent pas la politique de même origine. Le navigateur vérifie spécifiquement les en-têtes CORS dans la réponse du serveur et bloque la requête s'ils sont manquants ou incorrects. C'est pourquoi une API peut fonctionner parfaitement dans Postman mais échouer dans une application navigateur.
Qu'est-ce qu'une requête preflight et quand le navigateur l'envoie-t-il ?
Une requête preflight est une requête OPTIONS que le navigateur envoie automatiquement avant la requête réelle pour vérifier si le serveur autorise la requête inter-origines. Le navigateur envoie un preflight pour les requêtes qui utilisent des méthodes autres que GET, HEAD ou POST, qui incluent des en-têtes personnalisés ou qui utilisent des valeurs de Content-Type autres que application/x-www-form-urlencoded, multipart/form-data ou text/plain. Le serveur doit répondre avec les en-têtes CORS appropriés pour autoriser la requête réelle à se poursuivre.
Que signifie Access-Control-Allow-Origin: * et est-ce sûr ?
La valeur joker * signifie que le serveur autorise les requêtes depuis n'importe quelle origine. Bien que pratique pour les API publiques, cela peut représenter un risque de sécurité pour les API privées manipulant des données sensibles. Lors de l'utilisation de *, le serveur ne peut pas non plus définir Access-Control-Allow-Credentials sur true. Pour les API nécessitant une authentification, vous devez spécifier les origines exactes autorisées au lieu d'utiliser le joker.
Comment puis-je corriger les erreurs CORS sur mon serveur ?
Pour corriger les erreurs CORS, vous devez configurer votre serveur pour qu'il inclue les en-têtes CORS appropriés dans ses réponses. Au minimum, ajoutez Access-Control-Allow-Origin avec un joker (*) ou l'origine spécifique demandeuse. Pour les requêtes non simples, ajoutez également Access-Control-Allow-Methods et Access-Control-Allow-Headers. La plupart des frameworks web disposent de paquets middleware CORS qui simplifient cette configuration, comme cors pour Express.js, django-cors-headers pour Django ou rack-cors pour Ruby on Rails.
Cet outil effectue-t-il réellement de vraies requêtes inter-origines ?
Oui, cet outil effectue de véritables requêtes fetch depuis votre navigateur vers l'URL que vous spécifiez, ce qui signifie que la politique CORS du navigateur est pleinement appliquée. Si le serveur cible n'inclut pas d'en-têtes CORS, le navigateur bloquera la réponse et l'outil affichera un statut CORS bloqué. Cela vous donne une image précise du comportement de votre application navigateur lors de l'envoi de la même requête.