web-dev-qa-db-ja.com

Chrome拡張コードvsコンテンツスクリプトvsインジェクトスクリプト

Chrome新しいページが読み込まれるたびに関数init()を実行するための拡張機能を取得しようとしていますが、これを行う方法を理解しようとすると問題が発生します。わかりました。background.htmlで次のことを行う必要があります。

  1. chrome.tabs.onUpdated.addListener()を使用して、ページが変更されたときを確認します
  2. つかいます chrome.tabs.executeScriptスクリプトを実行します。

これは私が持っているコードです：

//background.html
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    chrome.tabs.executeScript(null, {code:"init();"});
});

//script.js
function init() {
    alert("It works!");
}

init（）関数が他のJSファイルにある他の関数にアクセスできるかどうかも疑問に思っていますか？

javascriptgoogle-chrome-extensionscopecontent-script
55
Jon

Chrome=拡張機能のJavaScriptコードは、次のグループに分類できます。

  • 拡張コード-許可されたすべての _chrome.*_ APIへのフルアクセス
    これには、 バックグラウンドページ 、および chrome.extension.getBackgroundPage() を介して直接アクセスできるすべてのページが含まれます。たとえば、 ブラウザのポップアップ 。

  • コンテンツスクリプト （マニフェストファイルまたは _chrome.tabs.executeScript_ 経由）- 部分 の一部へのアクセスchrome AP​​I、ページのDOMへのフルアクセス（notからwindowオブジェクト（フレームを含む）。
    コンテンツスクリプトは、拡張機能とページの間のスコープで実行されます。コンテンツスクリプトのグローバルwindowオブジェクトは、ページ/拡張機能のグローバル名前空間とは異なります。

  • 挿入されたスクリプト（コンテンツスクリプトの this method を使用）-ページ内のすべてのプロパティへのフルアクセス。 _chrome.*_ APIのいずれにもアクセスできません。
    挿入されたスクリプトは、ページ自体に含まれているかのように動作し、拡張機能に接続されていません。さまざまな注入方法の詳細については、 この投稿 を参照してください。

挿入されたスクリプトからコンテンツスクリプトにメッセージを送信するには、イベントを使用する必要があります。例については this answer をご覧ください。注：拡張機能内で1つのコンテキストから別のコンテキストに転送されるメッセージは、自動的に（JSON）シリアル化および解析されます。

あなたの場合、バックグラウンドページのコード（ _chrome.tabs.onUpdated_ ）は、おそらくコンテンツスクリプト_script.js_が評価される前に呼び出されます。 ReferenceErrorはでないため、initを取得します。

また、_chrome.tabs.onUpdated_を使用する場合は、イベントが2回発生するため、ページが完全にロードされているかどうかをテストしてください。ロード前と終了時：

_//background.html
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    if (changeInfo.status == 'complete') {
        // Execute some script when the page is fully (DOM) ready
        chrome.tabs.executeScript(null, {code:"init();"});
    }
});
_
159
Rob W