Chrome nie pozwala na modyfikowanie parametru document.domain

Jeśli Twoja witryna wymaga ustawienia document.domain, musisz podjąć odpowiednie kroki.

Co się zmienia i dlaczego?

Od Chrome 115 witryny nie będą mogły konfigurować document.domain: Chrome sprawi, że document.domain stanie się niezmienna. Do komunikacji z innymi domenami musisz użyć alternatywnych metod, takich jak postMessage() czy Channel Messaging API.

Zwróć uwagę, że ta zmiana będzie wprowadzana stopniowo.

Spodziewamy się, że w przyszłości inne przeglądarki wycofają i usuną tę funkcję. Więcej informacji znajdziesz w sekcji dotyczącej zgodności przeglądarki.

Dlaczego ustawienie document.domain ma być stałe?

Zadanie document.domain zostało zaprojektowane do pobierania lub ustawiania nazwy hosta źródła. Wiele witryn ustawia document.domain, aby umożliwić komunikację między stronami w tej samej witrynie, ale z innych domen.

Jest to wygodna metoda, ale stanowi zagrożenie dla bezpieczeństwa, ponieważ ogranicza zasadę dotyczącą tego samego pochodzenia. Obawy związane z bezpieczeństwem związane z document.domain spowodowały zmianę specyfikacji, która ostrzega użytkowników, aby jej nie używali.

Więcej informacji: dlaczego nie można zmienić parametru document.domain?

Jak obecnie korzysta się z aplikacji document.domain

Wiele witryn ustawia document.domain, aby umożliwić komunikację między stronami w tej samej witrynie, ale z innych domen.

Witryny z tej samej witryny, ale z innych domen, mają taką samą wartość eTLD+1, ale różne subdomeny.

Dotychczas w ten sposób wykorzystywano document.domain:

Załóżmy, że strona w domenie https://parent.example.com zawiera stronę iframe z witryny https://video.example.com. Te strony mają tę samą wartość eTLD + 1 (example.com) z różnymi subdomenami. Jeśli parametr document.domain obu stron ma wartość 'example.com', przeglądarka traktuje 2 źródła tak, jakby były tego samego pochodzenia.

Ustaw document.domain dla https://parent.example.com:

// Confirm the current origin of "parent.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

Ustaw document.domain dla https://video.example.com:

// Confirm the current origin of "video.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

Możesz teraz utworzyć manipulację DOM między domenami w tabeli https://parent.example.com z elementem https://video.example.com.

Witryny ustawiają document.domain, aby ułatwić komunikację między dokumentami z tej samej witryny. Ta zmiana łagodzi zasadę tego samego źródła, więc strona nadrzędna ma dostęp do dokumentu elementu iframe i przemierza drzewo DOM (i odwrotnie).

Jest to wygodna technika, ale stanowi zagrożenie dla bezpieczeństwa.

Problemy dotyczące bezpieczeństwa związane z usługą document.domain

Obawy związane z bezpieczeństwem związane z usługą document.domain spowodowały zmianę w specyfikacji, która ostrzega użytkowników, aby nie korzystali z niej.

Jeśli np. 2 strony z ustawieniem document.domain mogą udawać, że są tego samego pochodzenia. Jest to szczególnie ważne, gdy strony te korzystają z udostępnianej usługi hostingowej z różnymi subdomenami. Skonfigurowanie ustawienia document.domain daje dostęp do wszystkich stron hostowanych przez tę samą usługę, co ułatwia hakerom dostęp do Twoich witryn. Jest to możliwe, ponieważ document.domain ignoruje część numeru portu w domenie.

Aby dowiedzieć się więcej o wpływie ustawień document.domain na bezpieczeństwo, przeczytaj stronę „Document.domain” w MDN.

Zgodność z przeglądarką

• Specyfikacja HTML zawiera informację, że daną funkcję należy usunąć.
• Mozilla rozważa wyłączenie zasady document.domain jako domyślnego wartego prototypowania.
• Zespół WebKit zaznaczył, że są umiarkowanie pozytywne co do wycofania metody ustawiającej document.domain.
• Dyskusja z innymi dostawcami przeglądarek
• WhatWG / HTML grupy roboczej Pull Request (oczekuje na doświadczenie w eksperymentach)

Jak sprawdzić, czy dotyczy to mojej witryny?

Jeśli ta zmiana będzie miała wpływ na Twoją witrynę, w panelu Problemy w Narzędziach deweloperskich Chrome wyświetli ostrzeżenie – to ostrzeżenie zostało dodane w 2022 roku. Zwróć uwagę na żółtą flagę w prawym górnym rogu Narzędzi deweloperskich.

Możesz też przeprowadzić w swojej witrynie kontrolę wycofanych interfejsów API LightHouse, by znaleźć wszystkie interfejsy API, które mają zostać usunięte z Chrome.

Jeśli masz skonfigurowany interfejs API do raportowania, Chrome będzie Ci wysyłać raporty o wycofaniu, by poinformować Cię o nadchodzącym wycofaniu. Dowiedz się więcej o tym, jak używać interfejsu API do raportowania z istniejącymi usługami zbierania raportów lub przez stworzenie własnego rozwiązania.

Jak mogę zobaczyć tę zmianę w praktyce?

Ta zmiana będzie wdrażana stopniowo, począwszy od Chrome 115. Aby zobaczyć, jak wygląda ta zmiana, nawet jeśli nie została jeszcze wprowadzona w przeglądarce Chrome, możesz ją włączyć w ten sposób:

1. Otwórz aplikację chrome://flags/#origin-agent-cluster-default
2. Wybierz Włącz.
3. Uruchom ponownie Chrome.

Jakich alternatywnych rozwiązań mogę użyć?

Najlepszym sposobem jest niezmodyfikowanie elementu document.domain, na przykład przez hostowanie strony i wszystkich ramek składowych w tym samym źródle. Działa to we wszystkich wersjach wszystkich przeglądarek. Może to jednak wymagać znacznego przerobienia aplikacji, warto więc rozważyć alternatywne rozwiązania, które nadal zapewniają dostęp z innych domen.

Zamiast document.domain używaj interfejsu postMessage() lub Channel Messaging API

W większości przypadków interfejsy API z innych domen postMessage() lub Channel Messaging API mogą zastąpić document.domain.

W tym przykładzie:

1. https://parent.example.com żąda https://video.example.com w elemencie iframe, by manipulować DOM, wysyłając wiadomość przez postMessage().
2. https://video.example.com manipuluje DOM natychmiast po otrzymaniu wiadomości i powiadamia o powodzeniu z powrotem do systemu nadrzędnego.
3. https://parent.example.com potwierdza sukces.

https://parent.example.com:

// Send a message to https://video.example.com
iframe.postMessage('Request DOM manipulation', 'https://video.example.com');

// Receive messages
iframe.addEventListener('message', (event) => {
  // Reject all messages except ones from https://video.example.com
  if (event.origin !== 'https://video.example.com') return;

  // Filter success messages
  if (event.data === 'succeeded') {
    // DOM manipulation is succeeded
  }
});

https://video.example.com:

// Receive messages
window.addEventListener('message', (event) => {
  // Reject all messages except ones from https://parent.example.com
  if (event.origin !== 'https://parent.example.com') return;

  // Do a DOM manipulation on https://video.example.com.

  // Send a success message to https://parent.example.com
  event.source.postMessage('succeeded', event.origin);
});

Wypróbuj go i zobacz, jak to działa. Jeśli masz konkretne wymagania, które nie będą działać w usłudze postMessage() ani w interfejsie Channel Messaging API, daj nam znać na Twitterze za pomocą @ChromiumDev lub zapytaj na Stack Overflow, używając tagu document.domain.

W ostateczności wyślij nagłówek Origin-Agent-Cluster: ?0

Jeśli masz ważne powody, aby kontynuować konfigurowanie funkcji document.domain, możesz wysłać nagłówek odpowiedzi Origin-Agent-Cluster: ?0 wraz z dokumentem docelowym.

Origin-Agent-Cluster: ?0

Nagłówek Origin-Agent-Cluster informuje przeglądarkę, czy dokument ma być obsługiwany przez klaster agentów ze źródłem jako kluczem. Więcej informacji o Origin-Agent-Cluster znajdziesz w artykule Wysyłanie prośby o izolację wydajności za pomocą nagłówka Origin-Agent-Cluster.

Gdy wyślesz ten nagłówek, dokument może nadal ustawiać document.domain, nawet gdy domyślnie stanie się on stały.

Wszystkie inne dokumenty, które wymagają tego działania, również muszą wysyłać Origin-Agent-Cluster (pamiętaj, że document.domain nie będzie działać, jeśli ustawisz go tylko w jednym dokumencie).

Konfigurowanie zasady OriginAgentClusterDefaultEnabled dla zasady przedsiębiorstwa

Opcjonalnie administrator może skonfigurować zasadę OriginAgentClusterDefaultEnabled na false, aby domyślnie skonfigurować ustawienie document.domain w instancjach Chrome w całej organizacji. Więcej informacji znajdziesz w artykule Lista zasad Chrome Enterprise i zarządzanie nimi | Dokumentacja.

Zasoby

• Document.domain – internetowe interfejsy API | MDN
• Izolacja źródeł i wycofywanie document.domain
• Wycofuję document.domain. · Problem nr 564 · w3ctag/design-reviews

Podziękowania

Zdjęcie: Finan Akbar, Unsplash