Middleware CORS simule

Si tu as deja developpe une SPA (React, Vue, Angular) qui consomme une API Django, tu as probablement vu cette erreur dans la console : "Access to fetch has been blocked by CORS policy". CORS est un mecanisme de securite des navigateurs qui empeche une page chargee depuis un domaine de faire des requetes vers un autre domaine.

Pour autoriser ces requetes cross-origin, le serveur doit ajouter des headers specifiques dans ses reponses :

Access-Control-Allow-Origin : quels domaines ont le droit de faire des requêtes (ex: 'https://example.com' ou '*' pour tout le monde)

Access-Control-Allow-Methods : quelles méthodes HTTP sont autorisees (ex: 'GET, POST, PUT, DELETE')

Access-Control-Allow-Headers : quels headers le client peut envoyer (ex: 'Content-Type, Authorization')

Il y a aussi les requêtes "preflight" : avant une requête POST ou PUT, le navigateur envoie d'abord une requête OPTIONS pour demander au serveur ce qui est autorise. Le serveur doit repondre avec les bons headers.

Tu vas créer une classe CORSMiddleware qui :

__init__(allowed_origins, allowed_methods=None) : prend une liste de domaines autorises et optionnellement une liste de méthodes (par défaut GET, POST, PUT, DELETE, OPTIONS)

process_request(request) : vérifie si le domaine d'origine (request['origin']) est dans la whitelist. Si c'est une requête OPTIONS (preflight), retourne directement une réponse avec les headers CORS et status 200. Sinon, retourne None (continue).

process_response(request, response) : ajoute les headers CORS a la réponse si l'origine est autorisee.

Exemple :

cors = CORSMiddleware(['https://example.com', 'https://app.test.com'])
request = {'method': 'GET', 'origin': 'https://example.com'}
response = {'status': 200, 'headers': {}, 'body': 'data'}
result = cors.process_response(request, response)
result['headers']['Access-Control-Allow-Origin'] vaut 'https://example.com'

Tests (4/5)

Preflight OPTIONS autorise

cors = CORSMiddleware(['https://example.com'])
req = {'method': 'OPTIONS', 'origin': 'https://example.com'}
r = cors.process_request(req)
assert r is not None and r['status'] == 200
assert r['headers']['Access-Control-Allow-Origin'] == 'https://example.com'

Preflight OPTIONS refuse

cors = CORSMiddleware(['https://example.com'])
req = {'method': 'OPTIONS', 'origin': 'https://evil.com'}
r = cors.process_request(req)
assert r is None

Headers ajoutes a la réponse

cors = CORSMiddleware(['https://app.com'])
req = {'method': 'GET', 'origin': 'https://app.com'}
resp = {'status': 200, 'headers': {}, 'body': 'ok'}
r = cors.process_response(req, resp)
assert r['headers']['Access-Control-Allow-Origin'] == 'https://app.com'

Origine non autorisee pas de headers

cors = CORSMiddleware(['https://safe.com'])
req = {'method': 'GET', 'origin': 'https://unsafe.com'}
resp = {'status': 200, 'headers': {}, 'body': 'ok'}
r = cors.process_response(req, resp)
assert 'Access-Control-Allow-Origin' not in r.get('headers', {})

+ 0 tests cachés

Indices (3 disponibles)

Solution officielle

class CORSMiddleware:
    def __init__(self, allowed_origins, allowed_methods=None):
        self.allowed_origins = allowed_origins
        self.allowed_methods = allowed_methods or ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS']

    def process_request(self, request):
        origin = request.get('origin', '')
        if request.get('method') == 'OPTIONS' and origin in self.allowed_origins:
            return {
                'status': 200,
                'headers': {
                    'Access-Control-Allow-Origin': origin,
                    'Access-Control-Allow-Methods': ', '.join(self.allowed_methods),
                    'Access-Control-Allow-Headers': 'Content-Type, Authorization',
                },
                'body': '',
            }
        return None

    def process_response(self, request, response):
        origin = request.get('origin', '')
        if origin in self.allowed_origins:
            if 'headers' not in response:
                response['headers'] = {}
            response['headers']['Access-Control-Allow-Origin'] = origin
            response['headers']['Access-Control-Allow-Methods'] = ', '.join(self.allowed_methods)
        return response

← Tests d'API simules Rate Limiter →

solution.py

Bravo!

Middleware CORS simule

Tests (4/5)

Indices (3 disponibles)

Solution officielle