7

Chrome 拡張機能のバックグラウンド ページで、次の操作を行う必要があります。

  1. 拡張機能フォルダーにある、または背景ページによって動的に生成されるHTML ページを含むタブを作成します。
  2. 新しいタブが読み込まれたら、メッセージ パッシングを使用するためにコンテンツ スクリプトを挿入します。
  3. スクリプトが挿入されたら、データを含むメッセージを新しいタブに送信します。

これは常にエラーになります:
tabs.executeScript: URL "" のコンテンツにアクセスできません。拡張マニフェストは、このホストにアクセスする許可を要求する必要があります。
または、ページまたはスクリプトが拡張子フォルダーの .html および .js 専用ファイルに保存されている場合:
tabs.executeScript: Cannot access content of url "chrome-extension://ehdjfh.../page.html". 拡張マニフェストは、このホストにアクセスする許可を要求する必要があります。

chrome.tabs.executeScript()が実行され、コンテンツ スクリプト インジェクションがブロックされると、エラーが生成されます。（コード化されたhtml URLに文字列として直接渡されると切り捨てられる大きなデータをタブに渡すには、この構造が必要です）

以下は、機能する拡張機能の動作をテストするために使用できるコード サンプルです。Chrome で拡張機能をコピー アンド ペーストしてロードするだけです。

background.js

chrome.browserAction.onClicked.addListener(function() {
    var getSampleHTML = function() {
        return 'javascript:\'<!doctype html><html>' +
            '<head></head>' +
            '<body>' +
            '<p id="myId">page created...</p>' +
            '</body>' +
            '</html>\'';
    };

    // create a new tab with an html page that resides in extension domain:
    chrome.tabs.create({'url': getSampleHTML(), 'active': false}, function(tab){
        var getSampleScript = function() {
            return 'chrome.extension.onRequest.addListener(' +
                'function(request, sender, sendResponse) {' +
                    'if(request.action == "print_data" && sender.tab.id == ' + tab.id + '){' +
                        'var p = document.getElementById("myId");' +
                        'p += "<br>data received: " + request.data;' +
                    '}' +
                '});'
                'document.getElementById("myId").innerHTML += "<br>content-script loaded...";'
        };
        // inject the content-script in the page created:
        chrome.tabs.executeScript(tab.id, {code: getSampleScript()}, function(){
            // send the data to the content-script:
            chrome.tabs.sendRequest(tab.id, {action: "print_data",
                                             data: "some long data"});
        });
    });
});

マニフェスト.json

{
  "name": "ContentScript Injection Sample",
  "description": "",
  "version": "0.1",
  "permissions": ["tabs"],
  "background": {
    "persistent": false,
    "scripts": ["background.js"]
  },
  "browser_action": {
    "default_title": "open a new tab and inject contentscript"
  },
  "manifest_version": 2
}
4

1 に答える 1

6

私の間違いを指摘してくれた@RobWと@方觉に感謝します（私の間違いは、新しく作成されたタブに開かれたローカルWebページを通常のWebページと見なすことでした。代わりに、クロムに直接アクセスできます.ポップアップなどの拡張 API):

background.js

chrome.browserAction.onClicked.addListener(function() {
    // create a new tab with an html page that resides in extension domain:
    chrome.tabs.create({'url': chrome.extension.getURL("page.html"), 
                        'active': false}, function(tab){
        var selfTabId = tab.id;
        chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
            if (changeInfo.status == "complete" && tabId == selfTabId){
                // send the data to the page's script:
                var tabs = chrome.extension.getViews({type: "tab"});
                tabs[0].doSomething("some long data");
            }
        });
    });
});

page.html

<!doctype html>
<html>
    <head>
    </head>
    <body>
        <p id="myId">page created...</p>
        <script src="page.js" type="text/javascript"></script>
    </body>
</html>

page.js

var alreadyRun = false;
function doSomething(data){
    if (!alreadyRun) {
        var p = document.getElementById("myId");
        p.innerHTML += "<br>data received: " + data;
        // needed because opening eg. DevTools to inpect the page
        // will trigger both the "complete" state and the tabId conditions
        // in background.js:
        alreadyRun = true; 
    }
}
document.getElementById("myId").innerHTML += "<br>script loaded...";

私がこのソリューションのあまり好きではないのはchrome.tabs.onUpdated.addListener()、作成されたタブが完全にロードされているかどうかを確認するために を使用し、このようにして、開いているタブの状態の変化に対してトリガーされることです (それは役に立たない... 素晴らしいでしょう関心のあるタブのみチェックを実行する方法)

于 2013-08-05T17:53:44.547 に答える