このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

options_ui

型 Object
必須 いいえ
マニフェストバージョン 2 以上
例
json
"options_ui": {
  "page": "options/options.html"
}

options_ui キーは、拡張機能のオプションページを定義するために使用します。このページを使用すると、ユーザーが拡張機能の設定を変更できるようになります。

ユーザーがオプションページを開く方法はブラウザーによって異なり、open_in_tab 設定にも依存します。拡張機能から runtime.openOptionsPage() を使用してページを開くこともできます。

options_ui を拡張機能にパッケージされた HTML ファイルへのパスとして指定します。通常のウェブページのように、HTML、CSS、JavaScript ファイルを含めることができます。しかし、通常のページと異なり、拡張機能が権限を持つすべての WebExtension API を使用できます。しかし、バックグラウンドスクリプトとは異なるスコープで実行されます。

オプションページとバックグラウンドスクリプトの JavaScript 上で、データや関数を共有したい場合、バックグラウンドスクリプトの Window への参照を runtime.getBackgroundPage() を使用して直接取得するか、拡張機能内で実行されているいずれかのページの Window を extension.getViews() で取得します。あるいは、JavaScript で runtime.sendMessage()、runtime.onMessage、runtime.connect() を使用することで、オプションページとバックグラウンドスクリプト間で相互にコミュニケーションできます。 後者の方法 (や同等の runtime.Port ) でも バックグラウンドスクリプトと コンテンツスクリプト とでオプションを共有できます。

一般的に、オプションページで変更された設定は、ストレージ API を使用して、storage.sync (ユーザーがログインしているすべてのブラウザーインスタンス間で設定を同期する場合) または storage.local (現在のマシン / プロファイルのローカル設定にする場合) に保存します。バックグラウンドスクリプトまたはコンテンツスクリプトが変更を知る必要がある場合、これらのスクリプトで storage.onChanged にリスナーを追加できます。

構文

options_ui キーは次のコンテンツを持つオブジェクトです。

名前 型 説明
browser_style
省略可
Manifest V3 では
Boolean

省略可能です。デフォルト値は次のとおりです。

  • Manifest V2、および Firefox 115 より前の Manifest V3 では true
  • Firefox 115 以降の Manifest V3 では false

browser_style を true に設定しないでください。Firefox 118 以降の Manifest V3 ではサポートされていません。Manifest V3 への browser_style の移行を参照してください。

Firefox では chrome://browser/content/extension.css、macOS では chrome://browser/content/extension-mac.css でこのスタイルシートを確認できます。寸法を設定する場合、このスタイルシートが box-sizing: border-box を設定していることに注意してください(box-sizing を参照してください)。

open_in_tab
省略可
Boolean
  • false の場合、オプションページはブラウザーのアドオンマネージャーで開きます。
  • true の場合、オプションページは通常のブラウザータブで開きます。

デフォルト値は false です。

page String

必須です。

オプションページの仕様を含む HTML ファイルへのパスです。

パスは manifest.json 自体の位置からの相対パスです。

例

json
"options_ui": {
  "page": "options/options.html"
}

ブラウザーの互換性

関連情報