CHROME -EXTENSIONES: ¿Cómo puedo ejecutar el paso de mensajes varias veces?

Question 1

Estoy trabajando en un proyecto que produce una extensión de Chrome. En una página de fondo tengo una función denominada checkingProcess. Esta función se ejecuta cuando se abre una pestaña nueva o una ficha actualizada. (Traté de coger el cambio de URL aquí.)

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

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

A continuación, en el checkingProcess función, tengo algunas de las funciones para el manejo de datos y llamadas a la API. Entonces traté de recibir un mensaje que viene de la ventana emergente. Este mensaje representa que la ventana emergente, que fue inaugurado por el usuario.

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

Después de eso, envía una respuesta a la ventana emergente. En la ventana emergente, puedo escuchar el mensaje y el uso de la respuesta en la ventana emergente.

 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ı')
    })
  }, [])

Sin embargo, me doy cuenta de que este mensaje de proceso que sólo se ejecuta una vez, pero tengo que ejecutar varias veces para acceder a los datos en segundo plano de forma simultánea. ¿Cómo puedo hacer eso?

Question 2

El mensaje sólo se envía una vez porque es en la actualidad el programa de instalación en un React.useEffect con una lista vacía de dependencias. Esto significa que este código sólo se ejecuta una vez cuando el componente está montado. Si usted desea que se ejecute "varias veces" en primer lugar debe definir qué significa esto? Algunos ejemplos son:

La ejecución de sendMessage después de que un usuario realiza alguna acción, como hacer clic en un botón. En el caso de que usted no necesita useEffect. En su lugar, conecte un controlador de eventos para que el botón y realizar el sendMessage no.
La ejecución de sendMessage después de re-procesamiento de su componente. Simplemente quite el vacío de la lista de dependencias ([]) de su useEffect método. Nota: usar con precaución. Si la instalación de su componente de un modo que se re-hace a menudo, esto puede convertirse rápidamente en una situación en la que muchas llamadas a la API se realizan.
La ejecución de sendMessage después de algún estado, dentro de su componente de los cambios. Agregar esta variable a la lista de dependencias: [loaded]
La ejecución de sendMessage cada 10 segundos. Usted querrá usar setInterval dentro de su 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

El mensaje sólo se envía una vez porque es en la actualidad el programa de instalación en un React.useEffect con una lista vacía de dependencias. Esto significa que este código sólo se ejecuta una vez cuando el componente está montado. Si usted desea que se ejecute "varias veces" en primer lugar debe definir qué significa esto? Algunos ejemplos son:

La ejecución de sendMessage después de que un usuario realiza alguna acción, como hacer clic en un botón. En el caso de que usted no necesita useEffect. En su lugar, conecte un controlador de eventos para que el botón y realizar el sendMessage no.
La ejecución de sendMessage después de re-procesamiento de su componente. Simplemente quite el vacío de la lista de dependencias ([]) de su useEffect método. Nota: usar con precaución. Si la instalación de su componente de un modo que se re-hace a menudo, esto puede convertirse rápidamente en una situación en la que muchas llamadas a la API se realizan.
La ejecución de sendMessage después de algún estado, dentro de su componente de los cambios. Agregar esta variable a la lista de dependencias: [loaded]
La ejecución de sendMessage cada 10 segundos. Usted querrá usar setInterval dentro de su 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);
}, []);

CHROME -EXTENSIONES: ¿Cómo puedo ejecutar el paso de mensajes varias veces?

Pregunta

Mejor respuesta

En otros idiomas

Esta página está en otros idiomas

Popular en esta categoría

Las preguntas más habituales en esta categoría