chrome.pageAction

説明

chrome.pageAction API を使用して、Google Chrome のメインツールバーのアドレスバーの右にアイコンを配置します。ページ操作とは、現在のページで実行できる操作のうち、すべてのページには適用されない操作のことです。無効な場合、ページ操作はグレー表示されます。

対象

<ph type="x-smartling-placeholder"></ph> &amp;leq;MV2

例:

  • このページの RSS フィードに登録する
  • このページの写真からスライドショーを作成します

次のスクリーンショットの RSS アイコンは、RSS を購読できるページ アクションを表しています。 現在のページのフィードです

非表示のページ操作はグレー表示されます。たとえば、下の RSS フィードはグレー表示になっています。 現在のページのフィードを登録する:

代わりにブラウザ アクションを使用して、ユーザーが常にお客様のコンテンツを操作できるようにすることをご検討ください。 あります。

マニフェスト

次のように、拡張機能のマニフェストにページ アクションを登録します。

{
  "name": "My extension",
  ...
  "page_action": {
    "default_icon": {                    // optional
      "16": "images/icon16.png",           // optional
      "24": "images/icon24.png",           // optional
      "32": "images/icon32.png"            // optional
    },
    "default_title": "Google Mail",      // optional; shown in tooltip
    "default_popup": "popup.html"        // optional
  },
  ...
}

1.5 倍や 1.2 倍など、あまり一般的でないスケーリング ファクタのデバイスが一般的になりつつあるので、 アイコンには複数のサイズを指定することをおすすめします。Chrome が最も近いものを選択してスケーリング 16 の dip スペースを埋めることになりますまた、これにより、アイコンの表示サイズが変更された場合に、 異なるアイコンを指定するために追加の作業が必要です。サイズ差が極端に大きい場合は 拡大縮小されると、アイコンの細部が失われたり、ぼやけたりすることがあります。

デフォルトのアイコンを登録するための古い構文は引き続きサポートされます。

{
  "name": "My extension",
  ...
  "page_action": {
    ...
    "default_icon": "images/icon32.png"  // optional
    // equivalent to "default_icon": { "32": "images/icon32.png" }
  },
  ...
}

UI の各部

ブラウザのアクションと同様に、ページ アクションにもアイコン、ツールチップ、ポップアップを含めることができます。バッジを持たず できます。また、ページ操作がグレー表示されることがあります。Google Chat でアイコン、 ツールチップ、ポップアップについては、ブラウザ アクション UI に関する記事をご覧ください。

ページの操作を表示またはグレー表示するには、pageAction.show と それぞれ pageAction.hide メソッドを使用します。デフォルトでは、ページ操作はグレー表示になっています。ユーザーが アイコンを表示するタブを指定します。アイコンはタブが表示されるまで開いたままになります。 が閉じられたり、別の URL が表示され始めたりします（ユーザーがリンクをクリックした場合など）。

ヒント

視覚効果を最大限に高めるには、次のガイドラインに従ってください。

  • ごく一部のページでしか意味のない機能には、ページ操作を使用してください。
  • ほとんどのページに役立つ機能にはページ アクションを使用しないでください。ブラウザ アクションを使用する してください。
  • アイコンを頻繁にアニメーション化しないでください。ちょっとわずらわしい。

型

ImageDataType

画像のピクセルデータ。ImageData オブジェクト（canvas 要素からなど）にする必要があります。

タイプ

ImageData

TabDetails

Chrome 88 以降

プロパティ

  • tabId

    数値（省略可）

    状態をクエリするタブの ID。タブが指定されていない場合は、タブに固有ではない状態が返されます。

メソッド

getPopup()

<ph type="x-smartling-placeholder"></ph> 約束 
chrome.pageAction.getPopup(
  details: TabDetails,
  callback?: function,
)

このページ アクションのポップアップとして設定された HTML ドキュメント セットを取得します。

パラメータ

  • 詳細

    TabDetails

  • callback

    関数（省略可）

    callback パラメータは次のようになります。 

    (result: string) => void

    • 件の結果

      文字列

戻り値

  • Promise<文字列>

    Chrome 101 以降

    Promise は Manifest V3 以降でのみサポートされています。他のプラットフォームではコールバックを使用する必要があります。

getTitle()

<ph type="x-smartling-placeholder"></ph> 約束 
chrome.pageAction.getTitle(
  details: TabDetails,
  callback?: function,
)

ページ アクションのタイトルを取得します。

パラメータ

  • 詳細

    TabDetails

  • callback

    関数（省略可）

    callback パラメータは次のようになります。 

    (result: string) => void

    • 件の結果

      文字列

戻り値

  • Promise<文字列>

    Chrome 101 以降

    Promise は Manifest V3 以降でのみサポートされています。他のプラットフォームではコールバックを使用する必要があります。

hide()

<ph type="x-smartling-placeholder"></ph> 約束 
chrome.pageAction.hide(
  tabId: number,
  callback?: function,
)

ページ操作を非表示にします。非表示になったページ操作は Chrome ツールバーには引き続き表示されますが、グレー表示されます。

パラメータ

  • tabId

    数値

    ページ アクションを変更するタブの ID。

  • callback

    関数（省略可）

    Chrome 67 以降

    callback パラメータは次のようになります。 

    () => void

戻り値

  • 約束 <void>

    Chrome 101 以降

    Promise は Manifest V3 以降でのみサポートされています。他のプラットフォームではコールバックを使用する必要があります。

setIcon()

<ph type="x-smartling-placeholder"></ph> 約束 
chrome.pageAction.setIcon(
  details: object,
  callback?: function,
)

ページ アクションのアイコンを設定します。アイコンは、画像ファイルへのパス、キャンバス要素のピクセルデータ、またはいずれかの辞書として指定できます。path プロパティまたは imageData プロパティのいずれかを指定する必要があります。

パラメータ

  • 詳細

    オブジェクト

    • iconIndex

      数値（省略可）

      非推奨。この引数は無視されます。

    • imageData

      ImageData |オブジェクト（省略可）

      ImageData オブジェクトまたは辞書 {size ->ImageData} です。アイコンを辞書として指定すると、画面のピクセル密度に応じて実際に使用される画像が選択されます。1 つの画面スペース ユニットに収まる画像ピクセル数が scale の場合、scale × n のサイズの画像が選択されます。n は UI のアイコンのサイズです。画像を少なくとも 1 つ指定する必要があります。なお、「details.imageData = foo」'details.imageData = {'16': foo}' と同等です。

    • パス

      string |オブジェクト（省略可）

      相対画像パスまたは辞書 {size ->相対画像パス} は、設定するアイコンを指します。アイコンを辞書として指定すると、画面のピクセル密度に応じて実際に使用される画像が選択されます。1 つの画面スペース ユニットに収まる画像ピクセル数が scale の場合、scale × n のサイズの画像が選択されます。n は UI のアイコンのサイズです。画像を少なくとも 1 つ指定する必要があります。なお、「details.path = foo」'details.path = {'16': foo}' と同等です。

    • tabId

      数値

      ページ アクションを変更するタブの ID。

  • callback

    関数（省略可）

    callback パラメータは次のようになります。 

    () => void

戻り値

  • 約束 <void>

    Chrome 101 以降

    Promise は Manifest V3 以降でのみサポートされています。他のプラットフォームではコールバックを使用する必要があります。

setPopup()

<ph type="x-smartling-placeholder"></ph> 約束 
chrome.pageAction.setPopup(
  details: object,
  callback?: function,
)

ユーザーがページ操作のアイコンをクリックしたときにポップアップとして開くよう HTML ドキュメントを設定します。

パラメータ

  • 詳細

    オブジェクト

    • ポップアップ

      文字列

      ポップアップに表示する HTML ファイルへの相対パス。空の文字列（''）に設定すると、ポップアップは表示されません。

    • tabId

      数値

      ページ アクションを変更するタブの ID。

  • callback

    関数（省略可）

    Chrome 67 以降

    callback パラメータは次のようになります。 

    () => void

戻り値

  • 約束 <void>

    Chrome 101 以降

    Promise は Manifest V3 以降でのみサポートされています。他のプラットフォームではコールバックを使用する必要があります。

setTitle()

<ph type="x-smartling-placeholder"></ph> 約束 
chrome.pageAction.setTitle(
  details: object,
  callback?: function,
)

ページ アクションのタイトルを設定します。これは、ページ操作のツールチップに表示されます。

パラメータ

  • 詳細

    オブジェクト

    • tabId

      数値

      ページ アクションを変更するタブの ID。

    • title

      文字列

      ツールチップの文字列。

  • callback

    関数（省略可）

    Chrome 67 以降

    callback パラメータは次のようになります。 

    () => void

戻り値

  • 約束 <void>

    Chrome 101 以降

    Promise は Manifest V3 以降でのみサポートされています。他のプラットフォームではコールバックを使用する必要があります。

show()

<ph type="x-smartling-placeholder"></ph> 約束 
chrome.pageAction.show(
  tabId: number,
  callback?: function,
)

ページのアクションを表示します。タブが選択されると、ページ アクションが表示されます。

パラメータ

  • tabId

    数値

    ページ アクションを変更するタブの ID。

  • callback

    関数（省略可）

    Chrome 67 以降

    callback パラメータは次のようになります。 

    () => void

戻り値

  • 約束 <void>

    Chrome 101 以降

    Promise は Manifest V3 以降でのみサポートされています。他のプラットフォームではコールバックを使用する必要があります。

イベント

onClicked

chrome.pageAction.onClicked.addListener(
  callback: function,
)

ページ アクション アイコンがクリックされたときに呼び出されます。ページ アクションにポップアップがある場合、このイベントは配信されません。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。 

    (tab: tabs.Tab) => void