iframe-sandboxing en Permissions Policy

Sandbox-tokens schakelen specifieke mogelijkheden weer in: sandbox="allow-scripts allow-same-origin" staat scriptuitvoering en toegang tot dezelfde origin toe. Elk token versoepelt één beperking; combineer de minimale set die het iframe daadwerkelijk nodig heeft.

allow-scripts schakelt JavaScript in. allow-forms schakelt het verzenden van formulieren in. allow-popups schakelt window.open in. allow-same-origin voorkomt dat het iframe als een unieke origin wordt behandeld (nodig voor localStorage). allow-top-navigation staat navigatie van het bovenliggende venster toe.

De combinatie van allow-scripts met allow-same-origin voor een iframe dat je ook zelf host, geeft het iframe volledige toegang tot je origin — inclusief de mogelijkheid om zijn eigen sandbox te verwijderen. Combineer deze alleen voor vertrouwde inhoud; laat allow-same-origin weg bij niet-vertrouwde inhoud.

Het machtigingsbeleid (voorheen Feature Policy) bepaalt welke browser-API's (camera, microfoon, geolocatie, versnellingsmeter, gyroscoop, magnetometer, volledig scherm, automatisch afspelen) de pagina en haar iframes mogen gebruiken. Stel dit in op de bovenliggende pagina: Permissions-Policy: geolocation=() blokkeert geolocatie overal.

Het allow-attribuut op een iframe overschrijft het beleid van de bovenliggende pagina voor dat iframe: <iframe allow="camera; microphone"> staat die API's in het iframe toe, zelfs als het standaardbeleid van de bovenliggende pagina ze weigert.

Specificaties bevatten een steeds veranderende lijst — camera, microfoon, geolocatie, versnellingsmeter, gyroscoop, magnetometer, betalingen, USB, MIDI, volledig scherm, automatisch afspelen, beeld-in-beeld en tientallen andere. Controleer de lijst en weiger expliciet alles wat je pagina niet nodig heeft.

Het machtigingsbeleid meldt schendingen bij een geconfigureerd eindpunt, net als report-uri van CSP. Gebruik dit tijdens een migratie: schakel een strikt beleid in, kijk wat er stukgaat en versoepel het daarna stapsgewijs voor legitieme functies.

Stel voor gevoelige pagina's Cross-Origin-Opener-Policy: same-origin en Cross-Origin-Embedder-Policy: require-corp in. Hierdoor wordt de pagina geïsoleerd van vensters van andere origins, wat bescherming biedt tegen timingaanvallen in de stijl van Spectre en SharedArrayBuffer mogelijk maakt.

Sandbox + machtigingsbeleid + CSP + COOP/COEP werken samen in lagen. Elke laag beschermt tegen een andere aanvalsklasse. Inhoud van derden insluiten is riskant genoeg dat geen enkele maatregel volstaat — combineer ze zodat een omzeiling van de ene door een andere wordt opgevangen.

Gebruik het deelvenster Network en het deelvenster Issues in Chrome DevTools om schendingen van sandbox en machtigingen zichtbaar te maken. Veel schendingen zijn stil (de API retourneert gewoon undefined of wijst de promise af); expliciete rapportage-eindpunten helpen ze in productie te ontdekken.

Gebruik standaard sandbox-iframes en voeg alleen de tokens toe die de inhoud nodig heeft. Vermijd allow-scripts+allow-same-origin voor niet-vertrouwde inhoud. Gebruik het machtigingsbeleid om krachtige API's voor de hele site te weigeren en het allow-attribuut van het iframe om uitzonderingen toe te staan. Combineer dit met CSP en COOP/COEP voor gelaagde beveiliging.