クロムでデバッガを開発する

Question

私はJavascriptライブラリ用の拡張機能（デバッガ）の開発に取り組んでいます。初期の結果は問題なく、1つのバグを見つけました（そのバグがあるかどうかはわかりません）。問題は「コードが複数のタブを開いているとき（それぞれdev-toolsも開いているとき）、dev-toolsは開いているすべてのタブからメッセージを受け取りますが、そうではありません。提案は大きな助けになります。私は他のファイルに関連するコードを配置する必要があるなら、私に教えてください。

// manifest.jsonを

{ 
"manifest_version": 2, 
"name": "debugger", 
"version": "1.0", 
"description": "some", 
"author": "some", 
"devtools_page": "devtools.html", 
"background": { 
    "scripts": [ 
     "background.js" 
    ] 
}, 
"permissions": [ 
    "tabs", 
    "storage", 
    "<all_urls>" 
] 
} 

//コンテンツ-script.js

chrome.extension.sendMessage(message, function (message) { 
     console.log("message sent"); 
}); 
chrome.extension.onMessage.addListener(function (msg, sender, sendResponse) { 
    if (msg.action == 'debug') { 
     console.log("Message: " + msg.content); 
    } 
}); 

のパート

// Background.js

chrome.extension.onConnect.addListener(function (port) { 
    var extensionListener = function (message, sender, sendResponse) { 
     if (message.destination == "panel") { 
      port.postMessage(message); 
      // chrome.tabs.sendMessage(sender.tab.id, message, sendResponse); 
     } 
}); 

//バックグラウンドメッセージリスナーからあなたのケースオブジェクトsenderで

var port = chrome.extension.connect({ 
    name: "my-extension" 
}); 

port.onMessage.addListener(function (message) { 
    // do something with message 
}); 

Answer 1

をpanel.jsは（tab.id付き）プロパティtabが含まれているので、あなたがこのメッセージを送信したタブを認識することができます。

次に、あなたが使用して現在のタブを取得できます。

chrome.tabs.query({active: true, currentWindow: true}, function(foundTabs){ 
    //foundTabs[0].id //current tab id 
}); 

そして、それはあなたが唯一の現在のタブからのメッセージをフィルタリングできることを意味します。