Cross-Origin Resource Sharing (CORS) — to mechanizm, który pozwala aplikacjom webowym kontrolować, które zasoby mogą być dostępne z innych domen. To ważna część bezpieczeństwa, szczególnie gdy mowa o ochronie danych użytkowników. Kiedy rozumiesz, jak działa CORS, możesz skutecznie go skonfigurować dla swojej aplikacji i zapewnić bezpieczeństwo informacji.
Podstawy CORS
Kiedy przeglądarka wysyła zapytanie do innej domeny (nie tej, z której zasób został załadowany), automatycznie traktuje to jako zapytanie międzydomenowe. Aby zapytanie mogło zostać pomyślnie zrealizowane, zasób umieszczony na serwerze musi mieć skonfigurowane nagłówki CORS, które pozwalają na to zapytanie.
Nagłówki CORS
W odpowiedzi serwer może wysłać następujące nagłówki:
-
Access-Control-Allow-Origin: Wskazuje, które domeny mogą uzyskiwać dostęp do zasobu. -
Access-Control-Allow-Methods: Lista metod HTTP, które są dozwolone dla zapytania międzydomenowego. -
Access-Control-Allow-Headers: Nagłówki, które klient może używać w zapytaniu.
Konfiguracja CORS
Aby skonfigurować CORS, ważne jest, aby zrozumieć, które zasoby zamierzasz udostępnić oraz komu pozwalasz na ich uzyskanie.
Przykład konfiguracji serwera Node.js
const express = require('express');
const cors = require('cors');
const app = express();
const corsOptions = {
origin: 'https://example.com',
methods: 'GET,POST',
allowedHeaders: 'Content-Type'
};
app.use(cors(corsOptions));
app.get('/', (req, res) => {
res.json({ message: 'CORS skonfigurowano!' });
});
app.listen(3000, () => {
console.log('Serwer uruchomiony na porcie 3000');
});
W tym przykładzie używamy middleware cors dla Express, co pozwala na zapytania z domeny https://example.com. Ten przykład pokazuje, jak zezwolić tylko na zapytania GET i POST z konkretnej domeny.
Przykład konfiguracji serwera Ruby on Rails
class ApplicationController < ActionController::Base
protect_from_forgery with: :exception
before_action :cors_preflight_check
def cors_preflight_check
if request.method == 'OPTIONS'
headers['Access-Control-Allow-Origin'] = '*'
headers['Access-Control-Allow-Methods'] = 'POST, GET, OPTIONS'
headers['Access-Control-Allow-Headers'] = 'X-Requested-With, X-Prototype-Version'
render text: '', content_type: 'text/plain'
end
end
end
W tym przykładzie dodajemy metodę cors_preflight_check do obsługi zapytań OPTIONS, które są wysyłane przed głównym zapytaniem. To pozwala skonfigurować CORS dla całej aplikacji. Gwiazdka (*) wskazuje, że dozwolone są zapytania z dowolnej domeny.
Częste problemy z CORS
- Blokowanie zapytań: Może to wystąpić, jeśli serwer nieprawidłowo konfiguruje nagłówki CORS.
- Zapytania preflight: Przed głównym zapytaniem może zostać wysłane zapytanie wstępne (preflight) w celu sprawdzenia uprawnień, jeśli to nie jest uwzględnione, zapytanie zostanie zablokowane.
- Cache'owanie: Odpowiedzi CORS mogą być cache'owane, co wpływa na czas trwania uprawnień.
Kluczowe momenty
CORS pomaga zapewnić bezpieczeństwo Twoich aplikacji, ograniczając dostęp do zasobów z zewnętrznych stron. Konfiguracja nagłówków CORS jest ważnym krokiem, który może chronić Twoją aplikację webową przed niepożądanymi zapytaniami i zachować dane osobowe użytkowników w bezpieczeństwie.
Znajomość i prawidłowa konfiguracja CORS to ważny aspekt w rozwoju aplikacji webowych, który warto uwzględnić przez każdego programistę/programistkę.
```