Permissions-Policy: fullscreen directive

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The HTTP Permissions-Policy header fullscreen directive controls whether the current document is allowed to use Element.requestFullscreen().

Specifically, where a defined policy blocks use of this feature, requestFullscreen() calls will return a Promise that rejects with a TypeError.

Note: If both this directive (i.e., via the allow attribute) and the allowfullscreen attribute are present on an <iframe> element, this directive takes precedence.

Syntax

http
Permissions-Policy: fullscreen=<allowlist>;
<allowlist>

A list of origins for which permission is granted to use the feature. See Permissions-Policy > Syntax for more details.

Default policy

The default allowlist for fullscreen is self. The top-level browsing context and same-origin iframes are allowed access to the fullscreen feature by default.

Examples

Basic usage

SecureCorp Inc. wants to disallow fullscreen within all cross-origin iframes except those whose origin is https://example.com. It can do so by delivering the following HTTP response header to define a Permissions Policy:

http
Permissions-Policy: fullscreen=(self "https://example.com")

SecureCorp Inc. must also include an allow attribute on each <iframe> element where fullscreen is to be allowed:

html
<iframe src="https://example.com/presentation" allow="fullscreen"></iframe>

Note: Specifying the Permissions-Policy header in this manner disallows fullscreen for other origins, even if they are allowed by the <iframe> allow attribute.

Using the default policy

If an allowlist for fullscreen is not defined by a Permissions-Policy response header, user agents will apply the default allowlist self. In this mode, fullscreen is automatically allowed in the top-level browsing context and same-origin iframes, but not in cross-origin iframes.

To allow fullscreen in a cross-origin iframe, include an allow attribute on the <iframe> element:

html
<iframe src="https://other.com/videoplayer" allow="fullscreen"></iframe>

Specifications

Specification
Fullscreen API
# permissions-policy-integration

Browser compatibility

See also