Zasada tego samego pochodzenia to funkcja zabezpieczeń przeglądarki, która ogranicza sposób, w jaki dokumenty i skrypty z jednego źródła mogą wchodzić w interakcje z zasobami z innego źródła.
Przeglądarka może wczytywać i wyświetlać zasoby z wielu witryn jednocześnie. Możesz mieć otwartych kilka kart jednocześnie lub witryna może zawierać wiele elementów iframe z różnych witryn. Jeśli nie ma ograniczeń dotyczących interakcji między tymi zasobami, a skrypt zostanie przejęty przez hakerów, może on ujawnić wszystkie dane w przeglądarce użytkownika.
Zasada takiego samego pochodzenia zapobiega temu, blokując dostęp do odczytu zasobów wczytanych z innego źródła. „Ale przecież cały czas wczytuję obrazy i skrypty z innych źródeł”. Przeglądarki zezwalają kilku tagom na umieszczanie zasobów z innego źródła. Ta zasada jest głównie pozostałością historyczną i może narazić Twoją witrynę na luki w zabezpieczeniach, takie jak przechwytywanie kliknięć za pomocą elementów iframe. Możesz ograniczyć współdzielenie odczytu tych tagów, korzystając z zasad bezpieczeństwa treści.
Co uznaje się za tę samą domenę?
Źródło jest określane przez schemat (nazywany też protokołem, np. HTTP lub HTTPS), port (jeśli jest określony) i host. Jeśli wszystkie 3 elementy są takie same w przypadku 2 adresów URL, uznaje się, że pochodzą one z tego samego źródła. Na przykład http://www.example.com/foo to to samo źródło co http://www.example.com/bar, ale nie https://www.example.com/bar, ponieważ schemat jest inny.
Co jest dozwolone, a co zablokowane?
Zasadniczo umieszczanie zasobu współdzielenia jest dozwolone, ale odczytywanie takiego zasobu jest blokowane.
| elementy iframe |
Umieszczanie zasobów ze współdzielonych domen jest zwykle dozwolone (w zależności od dyrektywy X-Frame-Options), ale odczytywanie zasobów ze współdzielonych domen (np. używanie JavaScriptu do uzyskiwania dostępu do dokumentu w elemencie iframe) nie jest dozwolone.
|
| CSS |
CSS z innej domeny można umieścić za pomocą elementu <link> lub @import w pliku CSS. Może być wymagany prawidłowy nagłówek Content-Type.
|
| formularze |
Adresy URL z innych domen mogą być używane jako wartość atrybutu action elementów formularza. Aplikacja internetowa może zapisywać dane formularza w miejscu docelowym współdzielenia.
|
| obrazy | Umieszczanie obrazów ze współdzielonych źródeł jest dozwolone. Odczytywanie danych obrazu ze współdzielonego źródła (np. pobieranie danych binarnych z obrazu ze współdzielonego źródła za pomocą JavaScriptu) jest jednak blokowane. |
| multimedia |
Współdzielone treści wideo i audio można umieszczać za pomocą elementów <video> i <audio>.
|
| pismo | Skrypty współdzielenia mogą być umieszczane, ale dostęp do niektórych interfejsów API (np. żądań pobierania współdzielenia) może być zablokowany. |
TODO: DevSite - Think and Check assessment
Jak zapobiegać clickjackingowi
Atak zwany „clickjackingiem” polega na umieszczeniu witryny w elemencie iframe i nałożeniu na nią przezroczystych przycisków, które prowadzą do innego miejsca docelowego. Użytkownicy są oszukiwani i myślą, że uzyskują dostęp do Twojej aplikacji, podczas gdy wysyłają dane do atakujących.
Aby uniemożliwić innym witrynom umieszczanie Twojej witryny w elemencie iframe, dodaj do nagłówków HTTP zasadę zabezpieczeń treści z dyrektywą frame-ancestors.
Możesz też dodać X-Frame-Options do nagłówków HTTP. Listę opcji znajdziesz na stronie MDN.
Podsumowanie
Mamy nadzieję, że czujesz ulgę, wiedząc, że przeglądarki dokładają wszelkich starań, aby zapewnić bezpieczeństwo w internecie. Mimo że przeglądarki starają się zapewnić bezpieczeństwo, blokując dostęp do zasobów, czasami chcesz uzyskać dostęp do zasobów współdzielenia w swoich aplikacjach. W następnym przewodniku dowiesz się, czym jest współdzielenie zasobów pomiędzy serwerami z różnych domen (CORS) i jak poinformować przeglądarkę, że ładowanie zasobów z różnych domen jest dozwolone z zaufanych źródeł.