使ってみる」セクションを読んだ後、このガイドを使用して、拡張機能コンポーネント、Manifest V3 での機能、それらの組み合わせ方法の概要を確認してください。まず、拡張機能で何ができるかを把握します。拡張機能の 基本コンセプト セクションを参照し、これらの機能を組み合わせる方法について学習します。

ユーザー インターフェースをデザインする

ほとんどの拡張機能が動作するには、なんらかのユーザー操作が必要です。拡張機能プラットフォームには、さまざまな方法で拡張機能にインタラクションを追加することができます。これらのメソッドには、Chrome ツールバー、サイドパネル、コンテキスト メニューからトリガーするポップアップなどがあります。
chrome.sidePanel API を使用すると、ウェブページのメイン コンテンツとともにブラウザのサイドパネルにコンテンツをホストできます。
ツールバーにある拡張機能のアイコンの表示を管理します。
Google Chrome のコンテキスト メニューにアイテムを追加します。

ブラウザを制御する

Chrome の拡張機能 API を使用すると、ブラウザの動作を変更できます。
設定のオーバーライドを使用すると、選択した Chrome の設定をオーバーライドできます。また、拡張機能で HTML のページのオーバーライドを使用して、Google Chrome で通常提供されるページを置き換えることもできます。拡張機能により、ブックマーク マネージャー、履歴タブ、新しいタブをオーバーライドできます。
DevTools 拡張機能を使用すると、拡張機能に追加された DevTools ページから DevTools 固有の拡張機能 API にアクセスすることで、Chrome DevTools に機能を追加できます。また、chrome.debugger API を使用して、Chrome のリモート デバッグ プロトコルを呼び出すこともできます。1 つ以上のタブにアタッチして、ネットワーク操作の測定、JavaScript のデバッグ、DOM の変更などを行います。
chrome.notifications API を使用すると、テンプレートを使用して通知を作成し、ユーザーのシステムトレイに通知を表示できます。
ブラウザでアクセスしたページの記録を操作するには chrome.history API を、その他の閲覧データを管理するには chrome.browsingData API を使用します。よくアクセスするサイトにアクセスするには、chrome.topSites を使用します。
chrome.tabschrome.tabGroupschrome.windows などの API を使用して、ユーザーのブラウザを作成、変更、調整します。
chrome.commands API を使用して、拡張機能でアクションをトリガーするキーボード ショートカットを追加します。たとえば、ブラウザのアクションを開いたり、拡張機能にコマンドを送信したりするためのショートカットを追加できます。
chrome.identity API を使用して OAuth 2.0 アクセス トークンを取得します。
chrome.management API を使用すると、インストール済みで実行中の拡張機能のリストを管理できます。組み込みの新しいタブページをオーバーライドする拡張機能で特に便利です。
chrome.omnibox API を使用すると、Google Chrome のアドレスバーにキーワードを登録できます。
chrome.privacy API を使用すると、ユーザーのプライバシーに影響する可能性がある Chrome の機能の使用を管理できます。Chrome のプロキシ設定を管理するには、chrome.proxy API もご覧ください。
chrome.downloads API を使用して、ダウンロードをプログラムで開始、モニタリング、操作、検索します。
chrome.bookmarks API と chrome.readingList API を使用して、リストの作成、整理、その他の操作を行います。

ウェブの管理

ウェブページのコンテンツと動作を動的に変更できます。スクリプトを挿入したり、ネットワーク リクエストをインターセプトしたり、ウェブ API を使用してウェブページとやり取りしたりすることで、ウェブを制御および変更できます。
コンテンツ スクリプトは、ウェブページのコンテキストで実行されるファイルです。クライアントは標準のドキュメント オブジェクト モデル(DOM)を使用して、ブラウザがアクセスするウェブページの詳細を読み取って変更を加え、親拡張機能に情報を渡します。
"activeTab" 権限は、ユーザーが拡張機能を呼び出す(アクションをクリックするなど)ときに、現在アクティブなタブに拡張機能が一時的にアクセスできるようにします。タブへのアクセス権は、ユーザーがそのページにアクセスしている間は持続し、ユーザーが別のページに移動したりタブを閉じると取り消されます。
chrome.declarativeNetRequest API、chrome.webRequest API、chrome.webNavigation API を使用して、ネットワーク リクエストを監視、ブロック、変更します。
chrome.tabCapturegetDisplayMedia() などのウェブ プラットフォーム API を使用してタブ、ウィンドウ、画面から音声と動画を録画するさまざまな方法を学びます。
chrome.contentSettings API を使用すると、ウェブサイトによる Cookie、JavaScript、プラグインなどの機能の使用を許可するかどうかを指定できます。一般的に、コンテンツ設定では Chrome の動作をグローバルにではなくサイトごとにカスタマイズできます。

基本コンセプト

ウェブ プラットフォームと拡張機能の API を使用すると、さまざまな UI コンポーネントと拡張プラットフォームの機能を組み合わせて、より複雑な機能を構築できます。
拡張機能 Service Worker(service-worker.js)は、ブラウザがバックグラウンドで実行するイベントベースのスクリプトです。多くの場合、データの処理、拡張機能のさまざまな部分でのタスクの調整、拡張機能のイベント マネージャーとして使用されます。
権限の仕組みを理解します。また、どのような場合に権限が必要ない場合はリクエストしないのが適切かを理解します。
多くの場合、コンテンツ スクリプトなどの拡張機能ページでは、拡張機能 Service Worker と情報を送受信する必要があります。この場合、どちらの側でも相手側から送信されたメッセージをリッスンし、同じチャネルで応答できます。
拡張機能がネイティブ アプリとメッセージを交換できるようになります。
Manifest V3 拡張機能では、使用するすべてのコードを拡張機能自体にバンドルする必要があります。これにはさまざまな方法があります。
Chrome 拡張機能には、すべての拡張機能コンポーネントで利用できる専用の Storage API があります。特定のユースケース向けの 4 つの異なるストレージ領域と、データが更新されるたびに追跡するイベント リスナーが含まれています。
Service Worker には DOM アクセス権がありません。Offscreen API を使用すると、この拡張機能は新しいウィンドウやタブを開いて、ユーザー エクスペリエンスを中断することなく、非表示のドキュメント内で DOM API を使用できます。
クロスオリジン分離により、ウェブページで SharedArrayBuffer などの強力な機能を使用できるようになります。拡張機能では、マニフェスト キー "cross_origin_embedder_policy""cross_origin_opener_policy" に適切な値を指定することで、クロスオリジン分離を有効にできます。