は、私が実際のWebページにHTMLを注入Google Chrome拡張機能を構築していChromeの拡張機能

Question

に画像を埋め込みます。注射にも画像が含まれていますが、今では拡大画像内の画像を参照する方法が不思議です。これまでのところ、私はhttp://example.com/myimage.pngを使ってサーバ上でのみ参照することができました。しかし、これはロードするまで顕著になります。

それは拡張内の画像をパックし、ブラウザでどこからでも参照することは可能ですか？どうやって？

ありがとうございました。

Answer 1

あなたはchrome.extension.getURL()（docsが）内部拡張フォルダのURLを取得するために使用することができます。画像の相対パスを渡すと、そのURLの完全なURLが取得されます。

たとえば、「images」という名前のフォルダとその中に「profile.jpg」という名前の画像がある場合、両方とも拡張フォルダ内にある場合は、次のようにしてページの本文に挿入できます。

var image = document.createElement("img"); 
image.src = chrome.extension.getURL("images/profile.jpg"); 
document.getElementsByTagName("body")[0].appendChild(image); 

さらに、web_accessible_resourcesマニフェストプロパティdocumented hereをチェックしてください。このメソッドで利用できるようにリソースを宣言する必要があります。