extensão google chrome :: console.log () da página em segundo plano?


173

Se eu ligar console.log('something');da página pop-up, ou qualquer script incluído fora, ele funciona bem.

No entanto, como a página de plano de fundo não é executada diretamente na página pop-up, ela não é incluída no console.

Existe uma maneira de conseguir que console.log()a página de plano de fundo apareça no console da página pop-up?

existe alguma maneira de, a partir da página de plano de fundo, chamar uma função na página pop-up?


O que você quer dizer exatamente com "funciona bem"? Onde está lendo "alguma coisa"? O uso do console.log () em uma janela pop-up não deve ser impresso no console da página carregada - já que a pergunta tem 2 anos, a API foi alterada?
anddam

14
se você clicar com o botão direito do mouse -> inspecionar o pop-up na ação do navegador, receberá uma página de ferramentas do desenvolvedor para sua extensão. popup.js imprimirá logs para isso.
211313 not_shitashi

O comentário de @ not_shitashi deve ser a resposta para esta pergunta.
Gabe

Respostas:


154

Qualquer página de extensão (exceto scripts de conteúdo ) tem acesso direto à página de segundo plano via chrome.extension.getBackgroundPage().

Isso significa que, na página pop - up , você pode fazer:

chrome.extension.getBackgroundPage().console.log('foo');

Para facilitar o uso:

var bkg = chrome.extension.getBackgroundPage();
bkg.console.log('foo');

Agora, se você quiser fazer o mesmo nos scripts de conteúdo, precisará usar o Message Passing para conseguir isso. A razão, ambos pertencem a domínios diferentes, que fazem sentido. Existem muitos exemplos na página Passagem de mensagem para você conferir.

Espero que isso limpe tudo.


1
@MohamedMansour, esta solução não funciona para mim. Se alert() chrome.extension.getBackgroundPage()eu entendi null. Preciso ter permissões definidas ou alguma outra configuração?
gwg

@gwg sua extensão possui uma página de plano de fundo? De acordo com a documentação "Retorna nulo se a extensão não tiver uma página em segundo plano". developer.chrome.com/extensions/…
Mohamed Mansour

Isso funciona perfeitamente para minhas próprias mensagens serem console. Obrigado. Alguma idéia de como também fazer exceções, etc, do popup.js aparecer no console do background.js?
Steven_noble

195

Você pode abrir o console da página de plano de fundo se clicar no link "background.html" na lista de extensões.

Para acessar a página de plano de fundo que corresponde às suas extensões, abra Settings / Extensionsou abra uma nova guia e insira chrome://extensions. Você verá algo como esta captura de tela.

Diálogo de extensões do Chrome

Sob sua extensão, clique no link background page. Isto abre uma nova janela. Para a amostra do menu de contexto da janela tem o título: _generated_background_page.html.


4
Saúde, estou ciente disso, no entanto, abrir a página de plano de fundo diretamente não invoca nada da página pop-up.
quer

A abertura da página de plano de fundo não gera nenhuma informação de log do console.
Layke

O @Hailwood, ao abrir a página de segundo plano, não invoca nada, mas mostra o console para a página de segundo plano.
anddam

1
@Layke Depois de abrir a página de plano de fundo, você ainda precisa escrever nela, ou seja, use diretamente console.log () a partir da página de plano de fundo ou, como mohamed-mansour disse, chamando o mesmo método no objeto retornado por getBackgroundPage ()
anddam

3
Encontrei esta pergunta pesquisando como verificar uma saída de extensão (como OP) e achei esta resposta muito útil, pois me permitiu verificar o log do console sem passar por uma página de conteúdo.
anddam

66

Para responder sua pergunta diretamente, quando você chama console.log("something")de segundo plano, esta mensagem é registrada no console da página de segundo plano. Para visualizá-lo, você pode acessar chrome://extensions/e clicar nele inspect viewna sua extensão.

Quando você clica no pop-up, ele é carregado na página atual; portanto, o console.log deve mostrar a mensagem de log na página atual.


Eu também! É o mais simples e direto.
SaidbakR

minha extensão não tem isso, mas outras extensões têm! como faço para ativá-lo
Ahmed Eid

Se você tem 3 monitores como eu ... gire a cabeça. Estava abrindo o ChromeDevTools na extremidade oposta da minha matriz de monitores e eu não o vi.
MPEN

26

Você ainda pode usar console.log (), mas ele é registrado em um console separado. Para visualizá-lo - clique com o botão direito do mouse no ícone da extensão e selecione "Inspecionar pop-up".


12

A solução mais simples seria adicionar o seguinte código na parte superior do arquivo. Além disso, você pode usar toda a API do console do Chrome como faria normalmente.

 console = chrome.extension.getBackgroundPage().console;
// for instance, console.assert(1!=1) will return assertion error
// console.log("msg") ==> prints msg
// etc

9
const log = chrome.extension.getBackgroundPage().console.log;
log('something')

Abrir registro:

  • Aberto: chrome: // extensions /
  • Detalhes> Página de fundo

Você se importaria de fornecer mais explicações para seus comandos?
inetphantom 12/02/19

7

Tente isso, se você deseja fazer logon no console da página ativa:

chrome.tabs.executeScript({
    code: 'console.log("addd")'
});

1
Requer permissões de host para a guia atual.
Xan

Você pode adicioná-lo para teste e remover se você liberar o complemento.
precisa

1

Em relação à pergunta original, gostaria de acrescentar à resposta aceita por Mohamed Mansour que também há uma maneira de fazer isso funcionar ao contrário:

Você pode acessar outras páginas de extensão (página de opções, página pop-up) na página / script de plano de fundo com a chrome.extension.getViews()chamada. Como descrito aqui .

 // overwrite the console object with the right one.
var optionsPage = (  chrome.extension.getViews()  
                 &&  (chrome.extension.getViews().length > 1)  ) 
                ? chrome.extension.getViews()[1] : null;

 // safety precaution.
if (optionsPage) {
  var console = optionsPage.console;
}

1

É um post antigo, com boas respostas, mas adiciono meus dois bits. Não gosto de usar console.log, prefiro usar um logger que faça logon no console ou onde quiser, por isso tenho um módulo que define uma função de log um pouco como esta

function log(...args) {
  console.log(...args);
  chrome.extension.getBackgroundPage().console.log(...args);
}

Quando eu chamo log ("este é o meu log"), ele grava a mensagem no console pop-up e no console em segundo plano.

A vantagem é poder alterar o comportamento dos logs sem precisar alterar o código (como desativar logs para produção, etc ...)


0

Para obter um log do console a partir de uma página de segundo plano, você precisa escrever o seguinte snippet de código na sua página de segundo plano background.js -

chrome.extension.getBackgroundPage (). console.log ('olá');

Em seguida, carregue a extensão e inspecione sua página de plano de fundo para ver o log do console.

Continue!!

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.