Sto provando un sacco di tempo cercando di ottenere il codice nel mio script di contenuto per parlare con il mio pannello. (. Questa estensione aggiunge un nuovo pannello per gli strumenti Dev) Dal mio script contenuti posso fare questo:script di contenuto per devtools.js al mio nuovo pannello

chrome.extension.sendMessage({greeting: "hello"}, function(response) { 
    console.log(response.farewell); 
});

e posso raccoglierlo in uno script di fondo non è un problema.

chrome.extension.onMessage.addListener(
function(request, sender, sendResponse) { 
if (request.greeting == "hello") sendResponse({farewell: JSON.stringify(sender)}); 
});

Ma ho bisogno che il mio messaggio venga raccolto nei miei devtools JS. In questo modo posso parlare al pannello che ho aggiunto agli strumenti di sviluppo. Come lo posso fare?

fonte

2013-01-10 Raymond Camden

Per stabilire la connessione tra Devtools Page e più pagine content script, Background Page viene utilizzato come mediatore. Quindi, l'idea è di avere un canale da devtools a background e da background a content scripts. Questo è un metodo generico necessario per gestire la natura variabile degli script di contenuto execution time.

È possibile utilizzare il seguente script come riferimento per la comunicazione tra devtools.js e content scripts.

manifest.json

Registrato background, devtools e content scripts a manifest

{ 
    "name": "Inspected Windows Demo", 
    "description": "This demonstrates Inspected window API", 
    "devtools_page": "devtools.html", 
    "manifest_version": 2, 
    "version": "2", 
    "permissions": [ 
     "experimental", 
     "tabs" 
    ], 
    "background": { 
     "scripts": [ 
      "background.js" 
     ] 
    }, 
    "content_scripts": [ 
     { 
      "matches": [ 
       "<all_urls>" 
      ], 
      "js": [ 
       "myscript.js" 
      ] 
     } 
    ] 
}

devtools.html

Registrato devtools.js di osservare le CSP

<html> 

    <head> 
     <script src="devtools.js"></script> 
    </head> 

    <body></body> 

</html>

devtools.js

//Created a port with background page for continous message communication 
var port = chrome.extension.connect({ 
    name: "Sample Communication" //Given a Name 
}); 
//Posting message to background page 
port.postMessage("Request Tab Data"); 
//Hanlde response when recieved from background page 
port.onMessage.addListener(function (msg) { 
    console.log("Tab Data recieved is " + msg); 
});

MyScript.js

//Handler request from background page 
chrome.extension.onMessage.addListener(function (message, sender) { 
    console.log("In content Script Message Recieved is " + message); 
    //Send needed information to background page 
    chrome.extension.sendMessage("My URL is" + window.location.origin); 
});

background.js

//Handle request from devtools 
chrome.extension.onConnect.addListener(function (port) { 
    port.onMessage.addListener(function (message) { 
     //Request a tab for sending needed information 
     chrome.tabs.query({ 
      "status": "complete", 
      "currentWindow": true, 
      "url": "http://www.google.co.in/" 
     }, function (tabs) { 

      for (tab in tabs) { 
       //Sending Message to content scripts 
       chrome.tabs.sendMessage(tabs[tab].id, message); 
      } 
     }); 

    }); 
    //Posting back to Devtools 
    chrome.extension.onMessage.addListener(function (message, sender) { 
     port.postMessage(message); 
    }); 
});

uscita

potete vedere http://www.google.co.in/ accolte nel devtools pagina

Riferimenti

è possibile consultare la seguente documentazione per ulteriori informazioni.

fonte

2013-01-10 20:34:19 Sudarshan

script di contenuto per devtools.js al mio nuovo pannello

risposta

uscita

Riferimenti

Problemi correlati