Google używa technologii AI do tłumaczenia treści na Twój preferowany język. Tłumaczenia wygenerowane przez AI mogą zawierać błędy.

Przewodnik po włączeniu izolacji zasobów z innych domen

Izolacja od zasobów z innych domen umożliwia stronie internetowej korzystanie z zaawansowanych funkcji, takich jak SharedArrayBuffer. Z tego artykułu dowiesz się, jak włączyć izolację od zasobów z innych domen w swojej witrynie.

Eiji Kitamura

Z tego przewodnika dowiesz się, jak włączyć izolację od zasobów z innych domen. Izolacja od zasobów z innych domen jest wymagana, jeśli chcesz używać SharedArrayBuffer, performance.measureUserAgentSpecificMemory(), lub timera o wysokiej rozdzielczości i większej precyzji.

Jeśli chcesz włączyć izolację od zasobów współdzielonych, oceń, jaki wpływ będzie to miało na inne zasoby współdzielone w Twojej witrynie, np. na miejsca docelowe reklam.

Określanie, gdzie w witrynie używany jest obiekt `SharedArrayBuffer`

Od Chrome 92 funkcje, które używają obiektu SharedArrayBuffer nie będą działać bez izolacji od zasobów z innych domen. Jeśli ta strona została otwarta z powodu komunikatu o wycofaniu obiektu SharedArrayBuffer, prawdopodobnie Twoja witryna lub jeden z osadzonych w niej zasobów używa obiektu SharedArrayBuffer. Aby mieć pewność, że wycofanie nie spowoduje żadnych problemów w Twojej witrynie, zacznij od określenia, gdzie jest on używany.

Jeśli nie wiesz, gdzie w Twojej witrynie używany jest obiekt SharedArrayBuffer, możesz to sprawdzić na 2 sposoby:

Korzystanie z Narzędzi deweloperskich w Chrome
(Opcja zaawansowana) Korzystanie z raportowania o wycofaniu

Jeśli wiesz już, gdzie używasz obiektu SharedArrayBuffer, przejdź do sekcji Analizowanie wpływu izolacji od zasobów z innych domen.

Korzystanie z Narzędzi deweloperskich w Chrome

Narzędzia deweloperskie w Chrome umożliwiają deweloperom sprawdzanie witryn.

Otwórz Narzędzia deweloperskie w Chrome na stronie, która Twoim zdaniem może używać obiektu SharedArrayBuffer.
Wybierz panel Konsola.

Jeśli strona używa obiektu SharedArrayBuffer, pojawi się ten komunikat:

[Deprecation] SharedArrayBuffer will require cross-origin isolation as of M92, around May 2021. See  for more details. common-bundle.js:535

Nazwa pliku i numer wiersza na końcu wiadomości (np. common-bundle.js:535) wskazują, skąd pochodzi obiekt SharedArrayBuffer. Jeśli jest to biblioteka innej firmy, skontaktuj się z deweloperem, aby rozwiązać problem. Jeśli jest on zaimplementowany jako część Twojej witryny, postępuj zgodnie z instrukcjami poniżej, aby włączyć izolację od zasobów z innych domen.

Ostrzeżenie w konsoli Narzędzi deweloperskich, gdy obiekt SharedArrayBuffer jest używany bez izolacji od zasobów z innych domen.

(Opcja zaawansowana) Korzystanie z raportowania o wycofaniu

Niektóre przeglądarki mają funkcję raportowania o wycofywaniu interfejsów API do określonego punktu końcowego.

Skonfiguruj serwer raportów o wycofaniu i uzyskaj adres URL raportowania. Możesz to zrobić, korzystając z usługi publicznej lub tworząc własną.
Używając adresu URL, ustaw ten nagłówek HTTP na stronach, które potencjalnie obsługują SharedArrayBuffer.
```
Report-To: {"group":"default","max_age":86400,"endpoints":[{"url":"THE_DEPRECATION_ENDPOINT_URL"}]}
```
Gdy nagłówek zacznie się propagować, punkt końcowy, w którym się zarejestrowałeś(-aś), powinien zacząć zbierać raporty o wycofaniu.

Zobacz przykładową implementację.

Analizowanie wpływu izolacji od zasobów z innych domen

Czy nie byłoby wspaniale, gdyby można było ocenić wpływ włączenia izolacji od zasobów z innych domen na Twoją witrynę bez powodowania żadnych problemów? Nagłówki Cross-Origin-Opener-Policy-Report-Only i Cross-Origin-Embedder-Policy-Report-Only HTTP umożliwiają właśnie to.

Ustaw Cross-Origin-Opener-Policy-Report-Only: same-origin w dokumencie najwyższego poziomu. Jak sama nazwa wskazuje, ten nagłówek wysyła tylko raporty o wpływie, jaki COOP: same-origin miałby na Twoją witrynę. Nie wyłączy on komunikacji z wyskakującymi okienkami.
Skonfiguruj raportowanie i serwer WWW, aby odbierać i zapisywać raporty.
Ustaw Cross-Origin-Embedder-Policy-Report-Only: require-corp w dokumencie najwyższego poziomu. Ten nagłówek umożliwia sprawdzenie wpływu włączenia COEP: require-corp bez wpływu na działanie witryny. Możesz skonfigurować ten nagłówek tak, aby wysyłał raporty do tego samego serwera raportowania, który został skonfigurowany w poprzednim kroku.

Uwaga: włączenie izolacji od zasobów z innych domen spowoduje zablokowanie wczytywania zasobów z innych domen, na które nie wyrazisz wyraźnej zgody, i uniemożliwi dokumentowi najwyższego poziomu komunikowanie się z wyskakującymi okienkami. Szukamy sposobów na wdrożenie na dużą skalę Cross-Origin-Resource-Policy ponieważ izolacja od zasobów z innych domen wymaga, aby wszystkie zasoby podrzędne wyraźnie wyraziły na to zgodę.
Wpadliśmy na pomysł, aby pójść w przeciwnym kierunku: nowy tryb „bez danych logowania” COEP który umożliwia wczytywanie zasobów bez nagłówka CORP przez usunięcie wszystkich ich danych logowania. Mamy nadzieję, że ułatwi to Ci zadanie upewnienia się, że zasoby podrzędne wysyłają nagłówek Cross-Origin-Resource-Policy.
Chociaż tryb credentialless jest dostępny w Chrome od wersji 96, nie jest jeszcze obsługiwany przez żadną inną przeglądarkę. Może to utrudnić niektórym deweloperom wdrożenie COOP lub COEP na tym etapie.
Wiadomo też, że nagłówek Cross-Origin-Opener-Policy: same-origin spowoduje przerwanie integracji, które wymagają interakcji między oknami z innych domen, takich jak OAuth i płatności. Aby złagodzić ten problem, rozważamy złagodzenie warunku włączenia izolacji od zasobów z innych domen do Cross-Origin-Opener-Policy: same-origin-allow-popups.
W ten sposób będzie można komunikować się z oknem otwartym samodzielnie. Jeśli chcesz włączyć izolację od zasobów z innych domen, ale napotykasz te problemy, zalecamy zarejestrowanie się w testowaniu origin i poczekanie, aż nowe tryby będą dostępne. Nie planujemy zakończenia testowania origin, dopóki te nowe tryby nie będą dostępne.

Łagodzenie wpływu izolacji od zasobów z innych domen

Po określeniu, które zasoby będą objęte izolacją od zasobów z innych domen, postępuj zgodnie z ogólnymi wytycznymi dotyczącymi wyrażania zgody na korzystanie z tych zasobów z innych domen:

W przypadku zasobów współdzielenia, takich jak obrazy, skrypty, arkusze stylów, elementy iframe i inne, ustaw Cross-Origin-Resource-Policy:cross-origin nagłówek. W przypadku zasobów z tej samej witryny ustaw Cross-Origin-Resource-Policy:same-site nagłówek.
W przypadku zasobów, które można wczytać za pomocą CORS, upewnij się, że jest on włączony, ustawiając atrybut crossorigin w tagu HTML (np. <img src="example.jpg" crossorigin>). W przypadku żądania pobierania JavaScript upewnij się, że request.mode jest ustawiony na cors.
Jeśli chcesz używać zaawansowanych funkcji, takich jak SharedArrayBuffer, w wczytanym elemencie iframe, dodaj allow="cross-origin-isolated" do elementu <iframe>.
Jeśli zasoby współdzielone wczytywane do elementów iframe lub skryptów roboczych obejmują kolejną warstwę elementów iframe lub skryptów roboczych, przed przejściem dalej zastosuj rekurencyjnie kroki opisane w tej sekcji.
Gdy potwierdzisz, że wszystkie zasoby współdzielenia są objęte zgodą, ustaw nagłówek Cross-Origin-Embedder-Policy: require-corp w elementach iframe i skryptach roboczych (jest to wymagane niezależnie od tego, czy są to zasoby z tej samej domeny czy współdzielenia).
Upewnij się, że nie ma wyskakujących okienek współdzielenia, które wymagają komunikacji za pomocą postMessage(). Nie można ich utrzymać w działaniu, gdy włączona jest izolacja od zasobów z innych domen. Możesz przenieść komunikację do innego dokumentu, który nie jest izolowany od zasobów z innych domen, lub użyć innej metody komunikacji (np. żądań HTTP).

Włączanie izolacji od zasobów z innych domen

Po złagodzeniu wpływu izolacji od zasobów z innych domen postępuj zgodnie z ogólnymi wytycznymi, aby włączyć izolację od zasobów z innych domen:

Ustaw nagłówek Cross-Origin-Opener-Policy: same-origin w dokumencie najwyższego poziomu. Jeśli masz ustawiony nagłówek Cross-Origin-Opener-Policy-Report-Only: same-origin, zastąp go. Blokuje to komunikację między dokumentem najwyższego poziomu a jego wyskakującymi okienkami.
Ustaw nagłówek Cross-Origin-Embedder-Policy: require-corp w dokumencie najwyższego poziomu. Jeśli masz ustawiony nagłówek Cross-Origin-Embedder-Policy-Report-Only: require-corp, zastąp go. Spowoduje to zablokowanie wczytywania zasobów współdzielenia, na które nie wyrazisz zgody.
Sprawdź, czy self.crossOriginIsolated zwraca w konsoli wartość true, aby potwierdzić, że Twoja strona jest izolowana od zasobów z innych domen.

Włączenie izolacji od zasobów z innych domen na serwerze lokalnym może być trudne, ponieważ proste serwery nie obsługują wysyłania nagłówków. Możesz uruchomić Chrome z flagą wiersza poleceń --enable-features=SharedArrayBuffer, aby włączyć SharedArrayBuffer bez włączania izolacji od zasobów z innych domen. Dowiedz się, jak uruchomić Chrome z flagą wiersza poleceń na poszczególnych platformach.