Permissions Policy <iframe> restrictions

Permissions Policy allows web developers to selectively enable, disable, and modify the behavior of certain APIs and web features in the browser, and query the state (allowed or denied) in the current document for a given feature. The policies control what the browser can do and are inherited by all iframes on the page that has set the policy. That means for example that no iframe embedded in your page can go fullscreen, unless explicitly enabled, if your page has disallowed going fullscreen.

The Permissions-Policy response header:

Permissions-Policy: fullscreen=(self "https://exploited.cz")

• fullscreen: which origins can go fullscreen
  • self: current origin (scheme + host + port)
  • "https://exploited.cz": or anything embedded in an iframe loaded from my other site but not an embedded YouTube video for example, must be quoted

The Report-To response header:

Report-To: {"group":"default","max_age":1800,"endpoints":[{"url":"https://fetal.has.report/report"}],"include_subdomains":true}

• group: the name of the group, the Permissions Policy reports will always be sent to the group named default
• max_age: how long the browser should use the endpoint and report errors to it
• endpoints: reporting endpoint configuration, can specify multiple endpoints but reports will be sent to just one of them
  • url: where to send reports to, must be https://, otherwise the endpoint will be ignored

Note: the Report-To header here is mostly useless as the following violations happen in 3^rd party embedded iframes, and no reports are sent in such cases.

Embedded frame cannot go fullscreen

show the code ▼

<iframe src="https://exploited.cz/frames/fullscreen/fullscreen.html"></iframe>

• Fullscreen blocked by the current fullscreen policy
• No report will be sent, because the violation happened in an embedded iframe, and only first-party reports are sent
• Violation will be visible in Developer Tools in the Console tab

Fullscreen and other features can be allowed on a per-iframe basis with an allow attribute provided the Permissions-Policy header also contains the origin:

show the code ▼

<iframe src="https://exploited.cz/frames/fullscreen/fullscreen.html" allow="fullscreen"></iframe>

• Allowed because the Permissions-Policy header's fullscreen policy contains https://exploited.cz
• … and the iframe's allow attribute contains fullscreen
• Browsers with partial Permissions Policy support (or partial Feature Policy support) respect the allow="fullscreen" attribute and don't need (nor understand) the HTTP header

Related specs & documents

• Permissions Policy Working Draft
  • Permissions Policy Editor's Draft
• Permissions Policy explainer