Web Experience Platforms
Security
HTTP Header Series: Feature-Policy
Wednesday, January 29, 2020
Layer One - Director of Digital Delivery - Jim Schram
In our opening to this series, we discussed some of the reasons for Security Headers. In this post we will describe in more detail the (currently experimental) Feature-Policy header which provides a mechanism to allow and deny the use of browser features in its own frame, and in content within any <iframe> elements in the document. This header is similar to the CSP Header but it controls features like access to your camera or microphone.
Feature-Policy Syntax:
Feature-Policy: <policy-directive>; <policy-directive>
where <policy-directive> consists of: <directive> <allowlist> with no internal punctuation.
Feature-Policy Allowlist:
An allowlist is a list of origins that takes one or more of the following values, separated by spaces:
- *: The feature will be allowed in this document, and all nested browsing contexts (iframes) regardless of their origin.
- 'self': The feature will be allowed in this document, and in all nested browsing contexts (iframes) in the same origin.
- 'src': (In an iframe allow attribute only) The feature will be allowed in this iframe, as long as the document loaded into it comes from the same origin as the URL in the iframe's src attribute.
- 'none': The feature is disabled in top-level and nested browsing contexts.
- <origin(s)>: The feature is allowed for specific origins (for example, https://example.com). Origins should be separated by a space.
The values * (enable for all origins) or 'none' (disable for all origins) may only be used alone, while 'self' and 'src' may be used with one or more origins.
Feature-Policy Directives:
|
Directive |
Description |
|
accelerometer |
Controls whether the current document is allowed to gather information about the acceleration of the device through the Accelerometer interface. |
|
ambient-light-sensor |
Controls whether the current document is allowed to gather information about the amount of light in the environment around the device through the AmbientLightSensor interface. |
|
autoplay |
Controls whether the current document is allowed to autoplay media requested through the HTMLMediaElement interface. When this policy is disabled and there were no user gestures, the Promise returned by HTMLMediaElement.play() will reject with a DOMException. The autoplay attribute on <audio> and <video> elements will be ignored. |
|
battery |
Controls whether the use of the Battery Status API is allowed. When this policy is disabled, the Promise returned by Navigator.getBattery() will reject with a NotAllowedError DOMException. |
|
camera |
Controls whether the current document is allowed to use video input devices. When this policy is disabled, the Promise returned by getUserMedia() will reject with a NotAllowedError DOMException. |
|
display-capture |
Controls whether or not the current document is permitted to use the getDisplayMedia() method to capture screen contents. When this policy is disabled, the promise returned by getDisplayMedia() will reject with a NotAllowedError if permission is not obtained to capture the display's contents. |
|
document-domain |
Controls whether the current document is allowed to set document.domain. When this policy is disabled, attempting to set document.domain will fail and cause a SecurityError DOMException to be thrown. |
|
encrypted-media |
Controls whether the current document is allowed to use the Encrypted Media Extensions API (EME). When this policy is disabled, the Promise returned by Navigator.requestMediaKeySystemAccess() will reject with a DOMException. |
|
execution-while-not-rendered |
Controls whether tasks should execute in frames while they're not being rendered (e.g. if an iframe is hidden or display: none). |
|
execution-while-out-of-viewport |
Controls whether tasks should execute in frames while they're outside of the visible viewport. |
|
fullscreen |
Controls whether the current document is allowed to use Element.requestFullScreen(). When this policy is disabled, the returned Promise rejects with a TypeError. |
|
geolocation |
Controls whether the current document is allowed to use the Geolocation Interface. When this policy is disabled, calls to getCurrentPosition() and watchPosition() will cause those functions' callbacks to be invoked with a PositionError code of PERMISSION_DENIED. |
|
gyroscope |
Controls whether the current document is allowed to gather information about the orientation of the device through the Gyroscope interface. |
|
layout-animations |
Controls whether the current document is allowed to show layout animations. |
|
legacy-image-formats |
Controls whether the current document is allowed to display images in legacy formats. |
|
magnetometer |
Controls whether the current document is allowed to gather information about the orientation of the device through the Magnetometer interface. |
|
microphone |
Controls whether the current document is allowed to use audio input devices. When this policy is disabled, the Promise returned by MediaDevices.getUserMedia() will reject with a NotAllowedError. |
|
midi |
Controls whether the current document is allowed to use the Web MIDI API. When this policy is disabled, the Promise returned by Navigator.requestMIDIAccess() will reject with a DOMException |
|
navigation-override |
Controls the availability of mechanisms that enables the page author to take control over the behavior of spatial navigation, or to cancel it outright. |
|
oversized-images |
Controls whether the current document is allowed to download and display large images. |
|
payment |
Controls whether the current document is allowed to use the Payment Request API. When this policy is enabled, the PaymentRequest() constructor will throw a SecurityError DOMException. |
|
picture-in-picture |
Controls whether the current document is allowed to play a video in a Picture-in-Picture mode via the corresponding API. |
|
publickey-credentials-get |
Controls whether the current document is allowed to use the Web Authentication API to retreive already stored public-key credentials, i.e. via navigator.credentials.get({publicKey: ..., ...}). |
|
sync-xhr |
Controls whether the current document is allowed to make synchronous XMLHttpRequest requests. |
|
usb |
Controls whether the current document is allowed to use the WebUSB API. |
|
vr |
Controls whether the current document is allowed to use the WebVR API. When this policy is disabled, the Promise returned by Navigator.getVRDisplays() will reject with a DOMException. Keep in mind that the WebVR standard is in the process of being replaced with WebXR. |
|
wake-lock |
Controls whether the current document is allowed to use Wake Lock API to indicate that device should not enter power-saving mode. |
|
screen-wake-lock |
Controls whether the current document is allowed to use Screen Wake Lock API to indicate that device should not turn off or dim the screen. |
|
web-share |
Controls whether or not the current document is allowed to use the Navigator.share() of Web Share API to share text, links, images, and other content to arbitrary destinations of user's choice, e.g. mobile apps. |
|
xr-spatial-tracking |
Controls whether or not the current document is allowed to use the WebXR Device API to interact with a WebXR session. |
(Source: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Feature-Policy)
Examples:
Feature-Policy: microphone 'none'; geolocation 'none'Feature-Policy: camera 'self'; fullscreen *Feature-Policy: camera 'self’ https://example.com; autoplay 'self’ https://example.comInterested in learning more?
Contact Us