Configurer CORS pour les clients de navigateur
Autorisez les origines fiables à appeler votre API.
Configurer CORS pour les clients de navigateur est une leçon Flask Academy gratuite sur CoddyKit. Ceci est la leçon 2 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Flask Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Flask Academy comprend 4 leçons au total.
Certaines parties de cette leçon n'ont pas encore été traduites et s'affichent en anglais.
Why Browsers Block Calls
A browser refuses cross-origin requests by default for safety. This same-origin policy stops one site from quietly reading another.
What CORS Actually Is
CORS is a set of response headers that say which other origins may call your API. It opens the door on purpose.
An Origin Defined
An origin is the scheme, host, and port together. A different port or http versus https counts as a separate origin.
Meet Flask-CORS
You rarely write the headers by hand. The Flask-CORS extension adds the right ones for you on every response.
pip install Flask-CORSEnable It Globally
The simplest setup wraps the whole app. Calling CORS(app) allows every origin, which is fine while learning.
from flask_cors import CORS
CORS(app)Restrict to Trusted Origins
In real apps you name who may call you with origins. Anything not on the list is still blocked by the browser.
CORS(app, origins=["https://app.example.com"])Limit Which Routes
You can scope CORS to a path prefix with resources. Here only your API namespace is opened to outside callers.
CORS(app, resources={r"/api/*": {"origins": "*"}})The Key Header
Under the hood the magic is Access-Control-Allow-Origin. The browser reads it to decide whether to hand the response to your code.
Preflight Requests
For some calls the browser first sends an OPTIONS preflight to ask permission. Flask-CORS answers it automatically.
Allowing Credentials
To send cookies cross-origin you must set supports_credentials. Note that a wildcard origin is then no longer allowed.
CORS(app, supports_credentials=True)CORS Is Not Auth
Remember that CORS only guides browsers. It is not a security wall, so you still need real authentication on your API.
Quick Check
Choose where the CORS decision is enforced.
Recap
You saw why browsers block cross-origin calls, added Flask-CORS, restricted origins and routes, met preflight, and learned CORS is not auth. Well done!
Questions Fréquemment Posées
La leçon « Configurer CORS pour les clients de navigateur » est-elle gratuite ?
Oui — le texte complet de « Configurer CORS pour les clients de navigateur » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Flask Academy, passe à CoddyKit PRO. Le cours Flask Academy comprend 4 leçons au total.
Qu'est-ce que j'apprendrai dans « Configurer CORS pour les clients de navigateur » ?
Autorisez les origines fiables à appeler votre API. Tu pratiques Flask Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer Flask Academy ?
Aucune expérience préalable n'est requise. Flask Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 2 sur 4.
Combien de temps prend la leçon « Configurer CORS pour les clients de navigateur » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon Flask Academy ?
Oui. Chaque leçon Flask Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- Limiter les requêtes avec Flask-Limiter
- Configurer CORS pour les clients de navigateur
- En-têtes de sécurité et HTTPS
- Valider les entrées pour empêcher les injections