sendMessage do fundo da extensão ou pop-up para o script de conteúdo não funciona

Sei que essa pergunta foi feita repetidamente de maneiras diferentes, mas tentei passar por todas as respostas (espero não ter perdido ninguém) e nenhuma delas funcionou para mim.

Aqui está o código da minha extensão:

manifesto:

{
"name": "test",
"version": "1.1",
"background": 
{ 
    "scripts": ["contextMenus.js"]
},

"permissions": ["tabs", "<all_urls>", "contextMenus"],

"content_scripts" : [
    {
        "matches" : [ "http://*/*" ],
        "js": ["jquery-1.8.3.js", "jquery-ui.js"],
        "css": [ "jquery-ui.css" ],
        "js": ["openDialog.js"]
    }
],

"manifest_version": 2
}

contextMenus.js

function onClickHandler(info, tab) {
    if (info.menuItemId == "line1"){

      alert("You have selected: " + info.selectionText);

      chrome.extension.sendMessage({action:'open_dialog_box'}, function(){});

      alert("Req sent?");

    }
}

chrome.contextMenus.onClicked.addListener(onClickHandler);

chrome.runtime.onInstalled.addListener(function() {

  chrome.contextMenus.create({"id": "line1", "type": "normal", "title": "I'm line 1",     "contexts":["selection"]});

});

openDialog.js

chrome.extension.onMessage.addListener(function(msg, sender, sendResponse) {

  if (msg.action == 'open_dialog_box') {
    alert("Message recieved!");
  }
});

Os dois alertas da página de fundo funcionam, enquanto o do content_script não.

mensagem do log do console: Erro de porta: não foi possível estabelecer conexão. O fim de recebimento não existe.

Onde está minha culpa?

— Metrô
fonte

Você deve usar chrome.tabs.sendMessage()para enviar mensagens para scripts de conteúdo, não chrome.extension.sendMessage().

— apsillers

Respostas:

141

Em sua página de fundo, você deve chamar

chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    chrome.tabs.sendMessage(tabs[0].id, {action: "open_dialog_box"}, function(response) {});  
});

em vez de usar chrome.extension.sendMessagecomo você faz atualmente.

A chrome.tabsvariante envia mensagens para scripts de conteúdo, enquanto a chrome.extensionfunção envia mensagens para todos os outros componentes de extensão.

— Apsillers
fonte

Te agradece. Isso está correto, exceto que chrome.tabs.sendMessage deve especificar para qual guia enviar . Portanto, a solução é mudar para:

chrome.tabs.query({active: true}, function(tabs){  		  chrome.tabs.sendMessage(tab.id, {action: "open_dialog_box"}, function(response) { 			}); 		});

— Metrô

Essa resposta me ajudou. Muito obrigado por esta resposta útil.

— Touhid

o que deve escrever para receber em content-script.js?

— Kushal Jain

@KushalJain Acabei de descobrir isso. Em seu arquivo JS de script de conteúdo, você deseja adicionar um ouvinte de evento como este: chrome.runtime.onMessage.addListener( (message, sender, sendResponse) => { /* Code Here */ } ); messageé o parâmetro que contém { action: "open_dialog_box" }ou tudo o que você enviar. senderé um objeto que contém o ID de sua extensão do Chrome. sendResponseé o parâmetro que contém function(response) {}ou qualquer função que você passa para ser chamada assim que a mensagem for tratada.

— jsea

Esta solução não funcionou para mim. Estou seguindo a documentação exatamente. Copiei todo o código de developer.chrome.com/extensions/messaging Este é um exemplo muito simples, mas não conseguia acertar. Obtendo erro Não foi possível estabelecer conexão. O fim de recebimento não existe. Quaisquer ideias

— umsateesh

@apsillers está correto. Além disso, não se esqueça de retornar true em seu listener de script de conteúdo ou pode fechar muito cedo.

chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
    console.log(message)
    return true
});

— Ronan Ca
fonte