W tym artykule
Czym jest CORS?
Cross-Origin Resource Sharing (CORS) to mechanizm bezpieczeństwa przeglądarki kontrolujacy, ktore źródła webowe moga uzyskac dostęp do zasobow na twoim serwerze. Domyślnie przeglądarki wymuszaja polityke tego samego źródła, blokując żądania JavaScript do innej domeny, portu lub protokołu.
Nagłówki CORS informuja przeglądarkę, ktore żądania między zrodlami sa dozwolone. Bez prawidłowych nagłówków wywołania API z frontendu na jednej domenie do backendu na innej zakoncza sie błędem CORS. Generator nagłówków CORS tworzy prawidłowe nagłówki Access-Control-Allow-*.
Jak działają nagłówki CORS
CORS działa poprzez zestaw nagłówków odpowiedzi HTTP, ktore serwer wysyła, aby wskazac, ktore źródła, metody i nagłówki sa dozwolone.
- Access-Control-Allow-Origin — określa, ktore źródła moga uzyskac dostęp do zasobu (konkretna domena lub * dla dowolnego źródła)
- Żądania preflight — dla zlozon ych zadan przeglądarka najpierw wysyła żądanie OPTIONS, aby sprawdzic, czy faktyczne żądanie jest dozwolone
- Obsluga danych uwierzytelniających — Access-Control-Allow-Credentials: true umożliwia cookies i nagłówki autoryzacji, ale wymaga konkretnego źródła
Wypróbuj za darmo — bez rejestracji
Wygeneruj nagłówki CORS →Kiedy konfigurowac CORS
Konfiguracja CORS jest wymagana, gdy frontend i backend sa serwowane z różnych źródeł.
- Rozwoj API — API REST lub GraphQL dostępne z aplikacji frontendowych na różnych domenach wymagaja nagłówków CORS
- Konfiguracja CDN — serwowanie statycznych zasobow z poddomeny CDN wymaga CORS dla plikow czcionek i zadan API
- Mikroserwisy — usługi działające na różnych portach podczas lokalnego rozwoju wymagaja CORS do komunikacji przez przeglądarkę
Często zadawane pytania
Dlaczego nie moge po prostu uzyc Access-Control-Allow-Origin: * dla wszystkiego?
Znak wieloznaczny * pozwala na dowolne źródło, co jest odpowiednie dla publicznych API. Jednak nie moze byc używany z danymi uwierzytelniajacymi (cookies, nagłówki Authorization). Jeśli API wymaga uwierzytelnienia, należy podac dokładne źródło.
Czym jest żądanie preflight?
Preflight to żądanie HTTP OPTIONS, ktore przeglądarka automatycznie wysyła przed faktycznym żądaniem. Sprawdza, czy serwer zezwala na metode, nagłówki i źródło.
Jak naprawic blad 'No Access-Control-Allow-Origin header'?
Dodaj nagłówek Access-Control-Allow-Origin do odpowiedzi serwera z domena źródła zadajacego. Dla Express użyj middleware cors, dla Nginx dodaj dyrektywy add_header.