background - oninstalled - ¿Cómo puedo usar el port.postmessage para enviar información de la página de fondo al script de contenido en una extensión de Google Chrome?

dlp native messaging host

Question

He podido enviar datos desde la página de fondo al script de contenido. pero esto se hace usando sendrequest() . Tendré que enviar datos de ida y vuelta, así que estoy tratando de descubrir la sintaxis correcta para usar el port.postmessage de la página de fondo al script de contenido. Ya leí varias veces la página de google de Mensajes y parece que no la tengo. Incluso copié el código directamente de la página y probé sin resultado. todo lo que intento hacer ahora es enviar datos de la página de fondo a la secuencia de comandos de contenido usando connect en lugar de sendrequest . La respuesta del script de contenido me ocuparé más adelante ya que el código con esta respuesta ha sido la espina principal. Solo quiero entender el proceso paso a paso sin el conocimiento adicional de devolver una respuesta.

No estoy seguro de si esto infringe las reglas de esta placa pero alguien ME PUEDE dar un ejemplo de código para hacer esto (página de fondo y fragmento de script de contenido, la página de fondo es el remitente).

He pedido asistencia varias veces en este sitio solo para que me digan que lea la documentación o que visite sitios que ya he visitado.

¿Alguien puede ayudar aquí?

Answer 1

Si solo quieres un ejemplo de abrir un puerto desde la extensión a un script de contenido, aquí está lo más simple que puedo pensar. El fondo simplemente abre un puerto y envía "¡Hola, pestaña!" sobre el puerto, y el script de contenido envía un mensaje al fondo en cualquier momento que haga clic en la página web.

Creo que esto es bastante simple, así que no sé por qué estás tan estresado. Solo asegúrate de que la pestaña de contenido ya esté escuchando cuando el fondo intente conectarse (lo hago esperando hasta el evento "completo").

manifest.json:

{
  "name": "TestExt",
  "version": "0.1",
  "background_page": "background.html",
  "content_scripts": [{
    "matches": ["http://localhost/*"],  // same as background.html regexp
    "js": ["injected.js"]
  }],
  "permissions": [
    "tabs"  // ability to inject js and listen to onUpdated
  ]
}

background.html:

<script>
var interestingTabs = {};
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
  // same as manifest.json wildcard
  if (changeInfo.url && /http:////localhost(:/d+)?//(.|$)/.test(changeInfo.url)) {
    interestingTabs[tabId] = true;
  }
  if (changeInfo.status === ''complete'' && interestingTabs[tabId]) {
    delete interestingTabs[tabId];
    console.log(''Trying to connect to tab '' + tabId);
    var port = chrome.tabs.connect(tabId);
    port.onMessage.addListener(function(m) {
      console.log(''received message from tab '' + tabId + '':'');
      console.log(m);
    });
    port.postMessage(''Hello tab!'');
  }
});
</script>

injection.js:

chrome.extension.onConnect.addListener(function(port) {
  console.log(''Connected to content script!'');
  port.onMessage.addListener(function(m) {
    console.log(''Received message:'');
    console.log(m);
  });
  document.documentElement.addEventListener(''click'', function(e) {
    port.postMessage(''User clicked on a '' + e.target.tagName);
  }, true);
});

Answer 2

Documentación detallada y ejemplos fáciles (los más básicos) que se muestran en la página de documentación .

Además, una búsqueda rápida en le permitirá ver muchas preguntas similares con respuestas detalladas.