コンテントスクリプツ

コンテントスクリプツの拡張は、マニフェストファイルに記載されたリストにあるパターンにマッチした URL に対し、コンテンツのスクリプトファイルをロードするようブラウザに指示します。
ユーザーがその機能を呼び出すための UI は持ちません。

スクリプトファイルと URL パターンの関連付けが JavaScript コードの記述なしでできるので、簡易的なホワイト/ブラックリストを管理する拡張などが作成できます。

以降、ソースを使用して説明を行います。

コンテントスクリプツの manifest.json

コンテントスクリプツの manifest.json は以下のようになります。

manifest.json のキー “content_scripts” の内容に注目してください。

“matches” キーで拡張の機能を動作させる URL を、”js” で JavaScript ファイルを指定しています。

コンテンツスクリプツの拡張から呼び出される JS ファイル内のコードについて、特別な記述はとくに必要ありません。

一般的な Web コンテンツ上で使用される　JavaScript 構文から拡張が提供する API を呼びだすことができます。

今回のサンプルでは、URL ごとに呼び出された JS ファイルが判別できるように、各々以下のようなしごく単純なコードを記述しています。

前述のサンプルコードを実際に Microsoft Edge で動作させるには、以下の手順を実行します。

拡張用の各ファイルを配置するための空の作業フォルダを作成します。
　
テキストエディタにブラウザアクションの manifest.json のサンプルコードの内容を貼り付け、manifest.json という名前で作業フォルダに保存します。
　
テキストエディタで新しいテキストを作成し、コンテンツスクリプツで呼び出される JS ファイルのサンプルコードの内容を各々貼り付け、forMSDN_Blog.js、forMsEdge.js、forMsEdgeDev.js という名前で作業フォルダに保存します。
　
Edge 拡張のテストインストールの内容を参考に Edge に拡張をインストールします。
　
マニフェストファイルのリストされている以下の URL にアクセスします。
各ページごと以下のように alert ボックスが表示されるのを確認してください。

今回は、Microsoft Edge 用の拡張としてコンテンツスクリプツの機能について紹介しました。

コンテンツスクリプツを使用すると、マニフェストファイルに記載したパターンにマッチした URL の Web コンテンツに対し機能を実行することができます。

ブラウザーのインストールして使うという拡張の仕様上、頻繁なパターンリストが必要な用途には向きませんが、URL と機能の普遍的な組み合わせについては手軽に設定が可能です。

Clicky