1

Chrome 拡張機能の作成方法を学んでおり、こちらの公式ガイドの指示の 1 つに従おうとしています。

私が達成しようとしていることは次のとおりです。

  1. background.js は、ターゲット URL のページ アクションを示します。
  2. ページ アクションは、クリックするとスクリプトを実行します。
  3. 実行されたスクリプトは、ページに JavaScript を挿入します。

ここまでは順調ですね！次のスクリプトを使用して、ページに挿入します。

var injectJS = function(url, cb) {
    var h = document.getElementsByTagName('head')[0],
        s = document.createElement('script');
    s.type = 'text/javascript';
    s.src = url;
    if (cb)
        s.onload = cb;
    h.appendChild(s);
};
injectJS(chrome.extension.getURL('script/do_something.js'));

ここで、挿入されたスクリプトが拡張機能と通信できるようにしたいと考えています。
私が探しているのは、ドキュメントに記載されているもののようです。

https://developer.chrome.com/extensions/content_scripts.html#host-page-communication

問題は、コンソールを実行しようとするとwindow.postMessage、「DOM Exception 12」というエラーが表示されることです。

編集: サンプル コードを実行する最初の問題は解決されました。
私が得る他のエラーは、smaeコードからのものですport.postMessage:

Uncaught Error: Attempting to use a disconnected port object

コードは次のとおりです。

var port = chrome.runtime.connect();

// Respond to messages from the injected script to collect results
window.addEventListener('message', function(e) {
    if (e.source != window)
        return;
    if (e.data.type && (e.data.type == 'FROM_PAGE')) {
        console.log('Content script received: %s', e.data.text);
        port.postMessage(e.data.text);
    }
}, false);

基本的に、ページのリロード中に一時的にデータを保持しようとしています。コンテンツ スクリプト/挿入されたスクリプトはデータを収集し、次のページを読み込みます。バックグラウンド スクリプトは、すべてのページが読み込まれるまで結果を保持する必要があります。

4

1 に答える 1

6

port.postMessagecontentscript.js の例の と を混同しないでくださいwindow.postMessage。

port.postMessageは Chrome 拡張機能固有の API で、拡張機能内でメッセージを渡すことを目的としていますwindow.postMessageが、 はフレームとの通信に使用される JavaScript メソッドです。の 2 番目の引数window.postMessageは必須であり、ターゲットがメッセージの受信を許可されているかどうかを検証するために使用されます。

あなたの場合、ページからページ自体にメッセージを送信しているため、ワイルドカードを使用するだけでおそらく十分です。

window.postMessage({ type: "FROM_PAGE", text: "Hello from the webpage!" }, "*");
                                                                           ^^^
于 2013-04-18T10:44:21.263 に答える