Cross-Origin Resource Sharing (CORS) — to mechanizm, który pozwala aplikacjom internetowym kontrolować, które zasoby mogą być dostępne z innych domen. To ważna część bezpieczeństwa, szczególnie gdy chodzi o ochronę danych użytkowników. Gdy 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 żądanie do innej domeny (nie tej, z której zasób został załadowany), automatycznie traktuje to jako żądanie międzydomenowe. Aby żądanie mogło zostać pomyślnie zrealizowane, zasób umieszczony na serwerze musi mieć skonfigurowane nagłówki CORS, które pozwalają na to żądanie.
Nagłówki CORS
W odpowiedzi serwer może wysłać następujące nagłówki:
-
Access-Control-Allow-Origin: Określa, które domeny mogą uzyskiwać dostęp do zasobu. -
Access-Control-Allow-Methods: Lista metod HTTP, które są dozwolone dla żądania międzydomenowego. -
Access-Control-Allow-Headers: Nagłówki, które klient może używać w żądaniu.
Konfiguracja CORS
Aby skonfigurować CORS, ważne jest, aby zrozumieć, które zasoby zamierzasz otworzyć dla dostępu i komu zezwalasz 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, który pozwala na żądania z domeny https://example.com. Ten przykład pokazuje, jak zezwolić tylko na żądania 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 żądań OPTIONS, które są wysyłane przed głównym żądaniem. To pozwala skonfigurować CORS dla całej aplikacji. Gwiazdka (*) oznacza, że zezwala się na żądania z dowolnej domeny.
Typowe problemy z CORS
- Blokowanie żądań: Może to się zdarzyć, jeśli serwer nieprawidłowo konfiguruje nagłówki CORS.
- Żądania preflight: Przed głównym żądaniem może być wysłane żądanie wstępne (preflight) w celu sprawdzenia uprawnień, jeśli to nie zostanie uwzględnione, żądanie zostanie zablokowane.
- Cache: Odpowiedzi CORS mogą być buforowane, co wpływa na czas ważności uprawnień.
Kluczowe punkty
CORS pomaga zapewnić bezpieczeństwo Twoich aplikacji, ograniczając dostęp do zasobów z zewnętrznych witryn. Konfiguracja nagłówków CORS jest ważnym krokiem, który może chronić Twoją aplikację internetową przed niepożądanymi żądaniami i utrzymać dane osobowe użytkowników w bezpieczeństwie.
Znajomość i prawidłowa konfiguracja CORS to ważny aspekt w tworzeniu aplikacji internetowych, który powinien być brany pod uwagę przez każdego programistę/programistkę.