Chrome拡張機能で新しいタブを作成し、popup.jsから新しいタブのコンテンツスクリプトにメッセージを送信

Question

私のpopup.jsが現在のページのコンテンツスクリプトからメッセージを受け取り、配列を作成するChrome拡張機能を開発しています。次に、ボタンを押すと、popup.jsは新しいタブ（コンテンツスクリプトが実行中）を作成し、そのコンテンツスクリプトに配列を含むメッセージを送信します。

マイpopup.js：

//this message is sent from a different content script (for current page), not shown here 
chrome.runtime.onMessage.addListener(function(request, sender) { 

    if (request.action === "getSource") { 
     var arr = JSON.parse(request.source); 

     //create new tab 
     chrome.tabs.create({url: "newtab.html"}, function(tab){ 

      //send message to new tab 
      chrome.tabs.sendMessage(tab.id{ 
      action: "getDataArray", 
      source: JSON.stringify(arr) 
     }); 
    } 
}); 

NEWTAB-contentscript.js：

$(document).ready(function() { 

    chrome.runtime.onMessage.addListener(function(request, sender) { 

     if (request.action === "getDataArray") { 
     $("#result").html(JSON.parse(request.source)); 
     } 
}); 

がnewtab.html：

<script src="newtab-contentscript.js"></script> 

問題：NEWTAB-contentscript.jsは思われませんメッセージを受信する。

タブの作成やメッセージの送信方法に間違いがありますか？この問題を解決する方法はありますか？

Answer 1

我々はコメントで述べたように、私は多分$(document).readyがchrome.tabs.sendMessageからのメッセージを受信するには遅すぎだと思い、あなたが通り、コールバック内console.logのタイムスタンプを比較することで、新たなタブのコンテンツスクリプトの最初の行にそれをテストすることができます@ wOxxOmが挙げられます。

メッセージロジックをバックグラウンド（イベント）ページに移動し、メッセージの送信を開始するタイミングを制御できるnewtab-contentscript.jsからのメッセージの受け渡しをお勧めします。

サンプルコード

background.js

let source = null; 

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) { 
    // sent from another content script, intended for saving source 
    if(request.action === 'putSource') { 
     source = request.source; 
     chrome.tabs.create({ url: 'newtab.html' }); 
    } 
    // sent from newtab-contentscript, to get the source 
    if(request.action === 'getSource') { 
     sendResponse({ source: source }); 
    } 
}); 

NEWTAB-contentscript.js

chrome.runtime.sendMessage({action: 'getSource'}, function(response) { 
    $('#result').html(response.source); 
});