ブラウザーのツールバーにボタンを追加します。

ブラウザーアクションはブラウザーのツールバー内のボタンです。

これをボタンつきポップアップと関連付けられます。ポップアップは通常のウェブページ同様に、HTML, CSS, JavaScript を使って指定できます。ポップアップの中で動く JavaScript はバックグラウンドスクリプトとすべて同じ WebExtension API にアクセスできますが、グローバルコンテキストはブラウザーに表示される現在のページではなく、ポップアップになります。ウェブページに影響するには messages 経由で通信する必要があります。

ユーザーがアイコンをクリックした時に、ポップアップを指定していると、表示され — そしてコンテンツが読み込まれるでしょう 。ポップアップを指定していない時は、ユーザーがアイコンをクリックした時、拡張機能にイベントがディスパッチされます。

たいていのブラウザーアクションのプロパティは、manifest.json 内の browser_action キーを用いて宣言的に定義できます。

browserAction API では、次が可能です:

  • browserAction.onClicked を使ってアイコンのクリックをリッスンする
  • アイコンのプロパティ — アイコン、タイトル、ポップアップなど、の取得、設定。これはすべてのタブを通してグローバルにも、またはタブの ID を追加引数で渡すことで特定のタブだけにも取得、設定できます。

browserAction.ColorArray
RGBA 色を決める 0-255 の範囲の4整数の配列
browserAction.ImageDataType
画像のピクセルデータ。ImageData オブジェクト (例えば <canvas> 要素から) でないといけない。

関数

browserAction.setTitle()
ブラウザーアクションのタイトルをセットする。ツールチップに表示される。
browserAction.getTitle()
ブラウザーアクションのタイトルを取得します。
browserAction.setIcon()
ブラウザーアクションのアイコンをセットします。
browserAction.setPopup()
ユーザーがブラウザーアクションのアイコンをクリックした時に表示されるポップアップの HTML 文書をセットします。
browserAction.getPopup()
ブラウザーアクションのポップアップとしてセットされた HTML 文書を取得します。
browserAction.openPopup()
ブラウザーアクションのポップアップを開きます。
browserAction.setBadgeText()
ブラウザーアクションのバッジテキストをセットします。バッジはアイコンの上部に表示されます。
browserAction.getBadgeText()
ブラウザーアクションのバッジのテキストを取得します。
browserAction.setBadgeBackgroundColor()
バッジの背景色を指定します。
browserAction.getBadgeBackgroundColor()
バッジの背景色を取得します。
browserAction.enable()
タブのブラウザーアクションを有効にします。既定では、ブラウザーアクションはすべてのタブで有効です。
browserAction.disable()
タブのブラウザーアクションを無効にします。つまりタブがアクティブでもクリックできません。
browserAction.isEnabled()
ブラウザーアクションが有効か否かをチェックします。

イベント

browserAction.onClicked
ブラウザーアクションがクリックされた時に発火します。このイベントはブラウザーアクションがポップアップ付きでない場合は発火しません。

ブラウザ実装状況

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxOperaAndroid 版 Firefox
ColorArrayChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45Opera 完全対応 ありFirefox Android 未対応 なし
ImageDataTypeChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45Opera 完全対応 ありFirefox Android 未対応 なし
disableChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45Opera 完全対応 ありFirefox Android 未対応 なし
enableChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45Opera 完全対応 ありFirefox Android 未対応 なし
getBadgeBackgroundColorChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45Opera 完全対応 ありFirefox Android 未対応 なし
getBadgeTextChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45Opera 完全対応 ありFirefox Android 未対応 なし
getBadgeTextColorChrome 未対応 なしEdge 未対応 なしFirefox 完全対応 63Opera 未対応 なしFirefox Android 未対応 なし
getPopupChrome 完全対応 ありEdge 未対応 なしFirefox 完全対応 45Opera 完全対応 ありFirefox Android 完全対応 57
getTitleChrome 完全対応 ありEdge 完全対応 15Firefox 完全対応 45Opera 完全対応 ありFirefox Android 完全対応 55
isEnabledChrome 未対応 なしEdge 未対応 なしFirefox 完全対応 59Opera 未対応 なしFirefox Android 未対応 なし
onClickedChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45Opera 完全対応 ありFirefox Android 完全対応 55
openPopupChrome 未対応 なしEdge 未対応 なしFirefox 完全対応 57Opera 未対応 なしFirefox Android 未対応 なし
setBadgeBackgroundColorChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45
完全対応 45
未対応 45 — 58
補足
補足 Tab-specific badge background color is not cleared when a new page is loaded.
Opera 完全対応 ありFirefox Android 未対応 なし
setBadgeTextChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45
完全対応 45
未対応 45 — 58
補足
補足 Tab-specific badge text is not cleared when a new page is loaded.
Opera 完全対応 ありFirefox Android 未対応 なし
setBadgeTextColorChrome 未対応 なしEdge 未対応 なしFirefox 完全対応 63Opera 未対応 なしFirefox Android 未対応 なし
setIconChrome 完全対応 あり
補足
完全対応 あり
補足
補足 Before Chrome 23, `path` couldn't specify multiple icon files, but had to be a string specifying a single icon path.
Edge 完全対応 14
補足
完全対応 14
補足
補足 This call is not persisted.
補足 The imageData parameter is not accepted.
補足 The path parameter is required.
Firefox 完全対応 45
完全対応 45
未対応 45 — 58
補足
補足 Tab-specific icons are not cleared when a new page is loaded.
Opera 完全対応 15Firefox Android 未対応 なし
setPopupChrome 完全対応 ありEdge 完全対応 14Firefox 完全対応 45
完全対応 45
未対応 45 — 58
補足
補足 Tab-specific popups are not cleared when a new page is loaded.
Opera 完全対応 ありFirefox Android 完全対応 57
完全対応 57
未対応 57 — 58
補足
補足 Tab-specific popups are not cleared when a new page is loaded.
setTitleChrome 完全対応 ありEdge 完全対応 15Firefox 完全対応 45
完全対応 45
未対応 45 — 58
補足
補足 Tab-specific titles are not cleared when a new page is loaded.
Opera 完全対応 ありFirefox Android 完全対応 55
完全対応 55
未対応 55 — 58
補足
補足 Tab-specific titles are not cleared when a new page is loaded.

凡例

完全対応  
完全対応
未対応  
未対応
実装ノートを参照してください。
実装ノートを参照してください。

Example extensions

謝辞

この API は Chromium の chrome.browserAction API に基づいています。この文書は Chromium コードの browser_action.json から得ています。

Microsoft Edge の実装状況は Microsoft Corporation から提供されたものであり、ここでは Creative Commons Attribution 3.0 United States License に従っています。

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

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