CHROME -EXTENSÕES: Como posso executar a mensagem que passa várias vezes?

Question 1

Eu estou trabalhando em um projeto que produz uma extensão do google Chrome. Em uma página de plano de fundo, eu tenho uma função chamada checkingProcess. Esta função é executada quando uma nova guia é aberta ou uma guia é atualizado. (Eu tentei pegar a alteração da URL aqui.)

chrome.tabs.onActivated.addListener((activeInfo) => {
  checkingProcess(activeInfo.tabId)
})

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  checkingProcess(tab.id)
})

Em seguida, no checkingProcess função, eu tenho algumas funções para a manipulação de dados e chamadas de API. Então eu tentei receber uma mensagem que vem de pop-up. Esta mensagem representa que o pop-up foi aberta pelo usuário.

 chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
    if (request.msg === 'popup_opened') {
      sendResponse({
        matches_length: response['matches'].length,
        hostname: host,
      })
    }
    chrome.runtime.lastError
  })

Depois disso, ele envia uma resposta para o popup. No pop-up, que eu ouça a mensagem e use a resposta na caixa pop-up.

 useEffect(() => {
    chrome.runtime.sendMessage({ msg: 'popup_opened' }, (res) => {
      setHostname(res['hostname'])
      setMatchesLength(res['matches_length'])
      console.log(res['hostname'], 'burası')
      console.log(res['matches_length'], 'burası')
    })
  }, [])

No entanto, percebo que este processo de mensagem é executada apenas uma vez, mas eu preciso executá-lo várias vezes para acessar os dados em segundo plano, simultaneamente. Como posso fazer isso?

Question 2

A sua mensagem é enviada apenas uma vez porque é atualmente o programa de configuração em um React.useEffect com uma lista vazia de dependências. Isso significa que esse código vai ser executado apenas uma vez quando o componente é montado. Se você deseja executá-lo "várias vezes", você precisa primeiro definir o que isso significa? Exemplos são:

Execução sendMessage depois que um usuário executa alguma ação, como clicar em um botão. Nesse caso, você não precisa useEffect. Em vez disso, o fio de um manipulador de eventos para o botão e realizar o sendMessage não.
Execução sendMessage após a re-renderização do componente. Basta remover a lista vazia de dependências ([]) a partir de sua useEffect o método. Nota: use com cuidado. Se você configurar o componente em um caminho que ele re-faz com que, muitas vezes, isso pode rapidamente transformar-se em uma situação onde muitas chamadas de API são feitas.
Execução sendMessage depois de algum estado dentro de seu componente alterações. Adicionar esta variável para a lista de dependências: [loaded]
Execução sendMessage a cada 10 segundos. Você vai querer usar setInterval dentro de seu useEffect, como este:

useEffect(() => {
  const interval = setInterval(() => {
    chrome.runtime.sendMessage({ msg: 'popup_opened' }, (res) => {
      setHostname(res['hostname'])
      setMatchesLength(res['matches_length'])
      console.log(res['hostname'], 'burası')
      console.log(res['matches_length'], 'burası')
    })
  }, 10000);
  return () => clearInterval(interval);
}, []);

Martin Devillers · Answer 1 · 2021-11-22T13:42:25

A sua mensagem é enviada apenas uma vez porque é atualmente o programa de configuração em um React.useEffect com uma lista vazia de dependências. Isso significa que esse código vai ser executado apenas uma vez quando o componente é montado. Se você deseja executá-lo "várias vezes", você precisa primeiro definir o que isso significa? Exemplos são:

Execução sendMessage depois que um usuário executa alguma ação, como clicar em um botão. Nesse caso, você não precisa useEffect. Em vez disso, o fio de um manipulador de eventos para o botão e realizar o sendMessage não.
Execução sendMessage após a re-renderização do componente. Basta remover a lista vazia de dependências ([]) a partir de sua useEffect o método. Nota: use com cuidado. Se você configurar o componente em um caminho que ele re-faz com que, muitas vezes, isso pode rapidamente transformar-se em uma situação onde muitas chamadas de API são feitas.
Execução sendMessage depois de algum estado dentro de seu componente alterações. Adicionar esta variável para a lista de dependências: [loaded]
Execução sendMessage a cada 10 segundos. Você vai querer usar setInterval dentro de seu useEffect, como este:

useEffect(() => {
  const interval = setInterval(() => {
    chrome.runtime.sendMessage({ msg: 'popup_opened' }, (res) => {
      setHostname(res['hostname'])
      setMatchesLength(res['matches_length'])
      console.log(res['hostname'], 'burası')
      console.log(res['matches_length'], 'burası')
    })
  }, 10000);
  return () => clearInterval(interval);
}, []);

Eu quero que quando o uso de abrir pop-up, ele funciona novamente.

CHROME -EXTENSÕES: Como posso executar a mensagem que passa várias vezes?

Pergunta

Melhor resposta

Em outros idiomas

Esta página está em outros idiomas

Popular nesta categoria

Perguntas populares nesta categoria