ウェブでアクセス可能なリソースとは、ウェブページや他の拡張機能がアクセスできる拡張機能内のファイルのことです。拡張機能は通常、この機能を使用して、ウェブページに読み込む必要がある画像やその他のアセットを公開しますが、拡張機能のバンドルに含まれるアセットはウェブアクセスにできます。
デフォルトでは、どのリソースもウェブからアクセスできません。これは、ユーザーがインストールした拡張機能のフィンガープリントや、インストールされた拡張機能の脆弱性（XSS バグなど）が悪用される可能性があるためです。拡張機能のリソースにアクセスできるのは、拡張機能のオリジンから読み込まれたページまたはスクリプトのみです。
マニフェストの宣言
web_accessible_resources マニフェスト プロパティを使用して、公開するリソースとオリジンを宣言します。このプロパティは、リソースのアクセスルールを宣言するオブジェクトの配列です。各オブジェクトは複数の拡張リソースをリストし、matches または extension_ids キーの少なくとも 1 つに値を指定する必要があります。これにより、これらのリソースにアクセスできるオリジンを示す必要があります。
{
...
"web_accessible_resources": [
{
"resources": [ "test1.png", "test2.png" ],
"matches": [ "https://web-accessible-resources-1.glitch.me/*" ]
}, {
"resources": [ "test3.png", "test4.png" ],
"matches": [ "https://web-accessible-resources-2.glitch.me/*" ]
}
],
...
}
配列内の各オブジェクトには次の要素が含まれます。
"resources"- 拡張機能のルート ディレクトリから特定のリソースへの相対パスを含む文字列の配列。リソースにはワイルドカード一致にアスタリスク（
*）を使用できます。たとえば、"/images/*"は拡張機能のimages/ディレクトリ内のすべてのアイテムを再帰的に公開し、"*.png"はすべての PNG ファイルを公開します。 "matches"- 文字列の配列。各リソースのセットにアクセスできるサイトを指定する一致パターンが含まれます。オリジンのみが URL の照合に使用されます。オリジンにはサブドメインの照合が含まれます。Google Chrome では、パターンに「/*」以外のパスが含まれていると「Invalid match pattern」というエラーが表示されます。
"extension_ids"- 文字列の配列。各文字列には、リソースにアクセスできる拡張機能の ID が含まれます。
各要素には、"resources" 要素と、"matches" 要素または "extension_ids" 要素のいずれかを含める必要があります。これにより、パターンに一致するウェブページまたは ID が一致する拡張機能に、指定されたリソースを公開するマッピングが確立されます。
リソースの操作性
リソースは、runtime.getURL() メソッドで生成できる URL chrome-extension://[PACKAGE ID]/[PATH] を使用してウェブページで利用できます。リソースは適切な CORS ヘッダーで提供されるため、fetch() を使用して利用できます。
ウェブオリジンから拡張機能リソースへのナビゲーションは、ウェブでアクセス可能なリソースとして登録されていない限り、ブロックされます。次のような特殊なケースに注意してください。
- 拡張機能が webRequest API を使用して公開リソースのリクエストをウェブアクセスできないリソースにリダイレクトすると、このようなリクエストもブロックされます。
- ウェブアクセスできないリソースがリダイレクト拡張機能によって所有されている場合でも、公開リソースからのリダイレクトはブロックされます。
"incognito"フィールドの値が"split"に設定されていない限り、シークレット モードではナビゲーションがブロックされます。
コンテンツ スクリプト自体を許可する必要はありません。
例
ウェブアクセス可能なリソースの例では、機能する拡張機能でこの要素を使用する例が示されています。