Feature Policy

この記事は翻訳作業中です。

これは実験的な機能です。本番で使用する前にブラウザー実装状況をチェックしてください。

機能ポリシーで、ウェブ開発者はブラウザーの特定の機能や API を有効化、無効化したり、動作を変更したりすることができます。これは CSP に似ていますが、セキュリティの動作ではなく機能の制御を行うものです。

概要

機能ポリシーは、ウェブサイト全体でどの機能が使用されるか (または使用されないか) を明示的に宣言する仕組みを提供します。これにより、使用可能な機能を制限することによって、コードベースが時とともに進化し、サードパーティーのコンテンツをより安全に構成する場合であっても、ベストプラクティスを維持することができます。

機能ポリシーでは、ブラウザーがウェブサイト全体で使用されている特定の機能を実施するための一連の「ポリシー」を選択します。これらのポリシーは、サイトがアクセスできる API を制限したり、特定の機能についてブラウザーの既定の動作を変更したりすることができます。

機能ポリシーで行うことができるものの例です。

  • モバイル環境でサードパーティの動画の自動再生の既定の動作を変更する。
  • カメラやマイクなどの注意が必要な API をサイトが使用することを制限する。
  • iframe から全画面 API が利用できるようにする。
  • 同期 XHR や document.write() のような古い API の使用をブロックする。
  • 画像が正しい大きさであり、ビューポートに対して大きすぎないことを確認する。

概念と使い方

Feature Policy allows you to control which origins can use which features, both in the top-level page and in embedded frames. Essentially, you write a policy, which is an allowed list of origins for each feature. For every feature controlled by Feature Policy, the feature is only enabled in the current document or frame if its origin matches the allowed list of origins.

For each policy-controlled feature, the browser maintains a list of origins for which the feature is enabled, known as an allowlist. If you do not specify a policy for a feature, then a default allowlist will be used. The default allowlist is specific to each feature.

ポリシーを書く

A policy is described using a set of individual policy directives. A policy directive is a combination of a defined feature name, and an allowlist of origins that can use the feature.

ポリシーの指定

Feature Policy provides two ways to specify policies to control features:

The primary difference between the HTTP header and the allow attribute is that the allow attribute only controls features within an iframe. The header controls features in the response and any embedded content within the page.

For more details see Using Feature Policy.

ポリシーで制御する型

Though Feature Policy provides control of multiple features using a consistent syntax, the behavior of policy controlled features varies and depends on several factors.

The general principle is that there should be an intuitive or non-breaking way for web developers to detect or handle the case when the feature is disabled. Newly introduced features may have an explicit API to signal the state. Existing features that later integrate with Feature Policy will typically use existing mechanisms. Some approaches include:

  • Return "permission denied" for JavaScript API that require user permission grants.
  • Return false or error from an existing JavaScript API that provides access to feature.
  • Change the default values or options that control the feature behaviour.

The current set of policy-controlled features fall into two broad categories:

  • Enforcing best practices for good user experiences
  • Providing granular control over sensitive or powerful features

使い勝手を高めるためのベストプラクティス

There are several policy-controlled features to help enforce best practices for providing good performance and user experiences.

In most cases, the policy-controlled features represent functionality that when used will negatively impact the user experience. To avoid breaking existing web content, the default for such policy-controlled features is to allow the functionality to be used by all origins. Best practices are then enforced by using policies that disable the policy-controlled features. For more details see "Enforcing best practices for good user experiences".

The features include:

  • Animations
  • Image compression
  • Image downscaling
  • Legacy image formats
  • Synchronous scripts
  • Synchronous XMLHTTPRequest
  • Unsized media

特定の機能に対する細かい制御

The web provides functionality and APIs that may have privacy or security risks if abused. In some cases, you may wish to strictly limit how such functionality is used on a website. There are policy-controlled features to allow functionality to be enabled/disabled for specific origins or frames within a website. Where available, the feature integrates with the Permissions API, or feature-specific mechanisms to check if the feature is available.

The features include:

  • Accelerometer
  • Ambient light sensor
  • Autoplay
  • Camera
  • Encrypted media
  • Fullscreen
  • Geolocation
  • Gyroscope
  • Lazyload
  • Microphone
  • Midi
  • PaymentRequest
  • Picture-in-picture
  • Speaker
  • USB
  • VR / XR

仕様書

仕様書 状態 備考
Feature Policy
Feature-Policy の定義
ドラフト 初回定義。 Feature-Policy ヘッダーの定義。ディレクティブは制御する機能の仕様書で定義。詳細はそれぞれのディレクティブのページを参照。

ブラウザーの対応

機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応60 なし なし なし47 なし
accelerometer691 なし なし なし562 なし
ambient-light-sensor691 なし なし なし562 なし
animations684 なし なし なし555 なし
autoplay64 なし なし なし51 なし
camera59 なし なし なし48 なし
encrypted-media59 なし なし なし48 なし
fullscreen57 なし なし なし46 なし
geolocation56 なし なし なし45 なし
gyroscope691 なし なし なし562 なし
legacy-image-formats684 なし なし なし555 なし
magnetometer691 なし なし なし562 なし
maximum-downscaling-image684 なし なし なし555 なし
microphone59 なし なし なし48 なし
midi56 なし なし なし45 なし
payment56 なし なし なし45 なし
picture-in-picture なし なし なし なし なし なし
speaker59 なし なし なし48 なし
sync-xhr657 なし なし なし528 なし
unsized-media6610 なし なし なし5311 なし
usb60 なし なし なし47 なし
vibrate56 なし なし なし43 なし
vr62 なし なし なし49 なし
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応6060 なし なし47 なし なし
accelerometer693691 なし なし562 なし なし
ambient-light-sensor693691 なし なし562 なし なし
animations686684 なし なし555 なし なし
autoplay6464 なし なし51 なし なし
camera5959 なし なし48 なし なし
encrypted-media5959 なし なし48 なし なし
fullscreen5757 なし なし46 なし なし
geolocation5656 なし なし45 なし なし
gyroscope693691 なし なし562 なし なし
legacy-image-formats686684 なし なし555 なし なし
magnetometer693691 なし なし562 なし なし
maximum-downscaling-image686684 なし なし555 なし なし
microphone5959 なし なし48 なし なし
midi5656 なし なし45 なし なし
payment5656 なし なし45 なし なし
picture-in-picture なし なし なし なし なし なし なし
speaker5959 なし なし48 なし なし
sync-xhr659657 なし なし528 なし なし
unsized-media66126610 なし なし5311 なし なし
usb6060 なし なし47 なし なし
vibrate5656 なし なし43 なし なし
vr6262 なし なし49 なし なし

1. From version 69: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled). To change preferences in Chrome, visit chrome://flags.

2. From version 56: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled).

3. From version 69: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled).

4. From version 68: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled). To change preferences in Chrome, visit chrome://flags.

5. From version 55: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled).

6. From version 68: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled).

7. From version 65: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled). To change preferences in Chrome, visit chrome://flags.

8. From version 52: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled).

9. From version 65: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled).

10. From version 66: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled). To change preferences in Chrome, visit chrome://flags.

11. From version 53: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled).

12. From version 66: this feature is behind the #enable-experimental-productivity-features preference (needs to be set to Enabled).

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09
最終更新者: mfuji09,