Chrome schakelt het wijzigen van document.domain uit

Als uw website afhankelijk is van het instellen van document.domain, is actie van uw kant vereist.

Maud Nalpas
Eiji Kitamura

Wat verandert er, en waarom?

Vanaf Chrome versie 115 kunnen websites document.domain niet meer instellen: Chrome maakt document.domain onveranderlijk. Om te communiceren tussen verschillende oorsprongen, moet u alternatieve methoden gebruiken, zoals postMessage() of de Channel Messaging API.

Houd er rekening mee dat deze wijziging geleidelijk zal worden doorgevoerd.

We verwachten dat andere browsers deze functionaliteit uiteindelijk zullen uitfaseren en verwijderen. Raadpleeg het gedeelte over browsercompatibiliteit voor meer informatie.

Waarom zou je document.domain onveranderlijk maken?

document.domain is ontworpen om de hostnaam van de oorspronkelijke pagina op te halen of in te stellen. Veel websites stellen document.domain in om communicatie mogelijk te maken tussen pagina's van dezelfde site, maar van een andere oorsprong .

Hoewel dit een handige techniek is, brengt het een beveiligingsrisico met zich mee, omdat het het same-origin-beleid versoepelt . Beveiligingsproblemen rondom document.domain hebben geleid tot een wijziging in de specificatie die gebruikers waarschuwt om het niet te gebruiken .

In detail: Waarom zou je document.domain onveranderlijk maken?

Hoe document.domain tegenwoordig wordt gebruikt.

Veel websites stellen document.domain in om communicatie mogelijk te maken tussen pagina's van dezelfde site, maar met een andere oorsprong .

Websites met dezelfde locatie maar een andere oorsprong hebben dezelfde eTLD+1 , maar verschillende subdomeinen.

Zo werd document.domain tot nu toe gebruikt:

Stel dat een pagina op https://parent.example.com een ​​iframe-pagina van https://video.example.com insluit. Deze pagina's hebben dezelfde eTLD+1 ( example.com ), maar met verschillende subdomeinen. Wanneer document.domain van beide pagina's is ingesteld op 'example.com' , behandelt de browser de twee origins alsof ze dezelfde oorsprong hebben.

Stel het document.domain in op 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);

Stel het document.domain in op 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);

Je kunt nu een cross-origin DOM-manipulatie uitvoeren op https://parent.example.com ten opzichte van https://video.example.com .

Websites stellen document.domain in om de communicatie tussen documenten op dezelfde site te vergemakkelijken. Omdat deze wijziging het same-origin-beleid versoepelt , kan de ouderpagina het document van de iframe benaderen en door de DOM-structuur navigeren, en omgekeerd.

Dit is een handige techniek, maar brengt wel een veiligheidsrisico met zich mee.

Beveiligingsproblemen met document.domain

Beveiligingsproblemen rondom document.domain hebben geleid tot een wijziging in de specificatie, waarbij gebruikers worden gewaarschuwd om het gebruik ervan te vermijden .

Wanneer bijvoorbeeld twee pagina's document.domain instellen, kunnen ze doen alsof ze van dezelfde oorsprong zijn. Dit is vooral problematisch wanneer deze pagina's gebruikmaken van een gedeelde hostingdienst met verschillende subdomeinen. Het instellen van document.domain geeft toegang tot alle andere sites die door dezelfde dienst worden gehost, waardoor het voor aanvallers gemakkelijker wordt om toegang te krijgen tot uw sites. Dit is mogelijk omdat document.domain het poortnummer in het domein negeert.

Lees de pagina "Document.domain" op MDN voor meer informatie over de beveiligingsimplicaties van het instellen document.domain .

Browsercompatibiliteit

Hoe weet ik of mijn site getroffen is?

Als uw website door deze wijziging wordt beïnvloed, waarschuwt Chrome u in het paneel 'Problemen' van de ontwikkelaarstools. Deze waarschuwing is toegevoegd in 2022. Let op het gele vlaggetje rechtsboven in de ontwikkelaarstools.

Schermafbeelding van de waarschuwing in DevTools

Je kunt je site ook door de LightHouse-audit voor verouderde API's halen om alle API's te vinden die naar verwachting uit Chrome zullen worden verwijderd.

Als u de Reporting API hebt ingesteld, heeft Chrome u meldingen gestuurd over de aanstaande stopzetting van deze functionaliteit. Lees meer over het gebruik van de Reporting API met bestaande rapportageservices of door uw eigen oplossing te ontwikkelen.

Hoe zie ik deze verandering in de praktijk?

De wijziging wordt geleidelijk uitgerold, te beginnen met Chrome 115. Om deze wijziging in actie te zien, zelfs als deze nog niet in uw Chrome-browser is doorgevoerd, kunt u deze als volgt inschakelen:

  1. Open chrome://flags/#origin-agent-cluster-default
  2. Selecteer ' Inschakelen'.
  3. Chrome opnieuw opstarten.

Welke alternatieven kan ik gebruiken?

De beste optie is om document.domain helemaal niet te wijzigen, bijvoorbeeld door de pagina en alle bijbehorende frames op dezelfde origin te hosten. Dit werkt in alle versies van alle browsers. Maar dit kan aanzienlijke aanpassingen aan een applicatie vereisen, dus het is de moeite waard om ook te kijken naar alternatieven die toegang vanaf verschillende origins blijven ondersteunen.

Gebruik postMessage() of de Channel Messaging API in plaats van document.domain

In de meeste gevallen kunnen cross-origin postMessage() of de Channel Messaging API document.domain vervangen.

In het volgende voorbeeld:

  1. https://parent.example.com verzoekt https://video.example.com binnen een iframe om de DOM te manipuleren door een bericht te verzenden via postMessage() .
  2. https://video.example.com manipuleert de DOM zodra het bericht binnenkomt en meldt het succes terug aan het bovenliggende element.
  3. https://parent.example.com erkent het succes.

Op 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
  }
});

Op 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);
});

Probeer het eens en kijk hoe het werkt. Als je specifieke vereisten hebt die niet werken met postMessage() of de Channel Messaging API, laat het ons dan weten op Twitter via @ChromiumDev of stel je vraag op Stack Overflow met een document.domain tag .

Als laatste redmiddel kunt u de Origin-Agent-Cluster: ?0 header verzenden.

Als u goede redenen hebt om document.domain te blijven gebruiken, kunt u de responsheader Origin-Agent-Cluster: ?0 meesturen met het doeldocument.

Origin-Agent-Cluster: ?0

De Origin-Agent-Cluster header geeft de browser instructies of het document al dan niet door het agentcluster met de oorspronkelijke sleutel moet worden verwerkt. Lees voor meer informatie over Origin-Agent-Cluster het artikel 'Prestatie-isolatie aanvragen met de Origin-Agent-Cluster header' .

Wanneer je deze header meestuurt, kan je document document.domain blijven instellen, zelfs nadat het standaard onveranderlijk is geworden.

Alle andere documenten die dit gedrag vereisen, moeten ook een Origin-Agent-Cluster verzenden (merk op dat document.domain geen effect heeft als slechts één document dit instelt).

Configureer OriginAgentClusterDefaultEnabled voor het bedrijfsbeleid.

Uw beheerder kan er optioneel voor kiezen om het beleid OriginAgentClusterDefaultEnabled op false in te stellen, zodat document.domain standaard instelbaar is op Chrome-instanties binnen uw organisatie. Lees voor meer informatie Chrome Enterprise Policy List & Management | Documentation .

Bronnen

Dankbetuigingen

Foto door Finan Akbar op Unsplash