Chrome extension-extraire la variable globale de la page Web
je travaille sur une extension pour Chrome. Je souhaite analyser le contenu du message Gmail "original" (le message actuellement affiché).
j'ai essayé d'utiliser le jQuery.charge() comme suit
$(windows).load(function() { alert(GLOBALS); });
et le placer au script de contenu, mais il ne fonctionne pas non plus. J'utilise les outils de développement de Chrome, qui renvoie l'erreur suivante sur l'invocation du alert(GLOBALS);
Uncaught ReferenceError: GLOBALS n'est pas défini
bien que, lors de l'utilisation de la console des outils de développeurs, en tapant dans la console GLOBALS il renvoie un tableau.
vous savez comment accéder aux GLOBALS à partir du script de contenu?
4 réponses
scripts de Contenu exécuter dans un environnement isolé. Pour accéder aux propriétés globales (de la page window ), vous devez soit injecter un nouvel élément <script> , soit utiliser des écouteurs d'événements pour passer des données.
Voir cette réponse par exemple sur l'injection d'un <script> élément dans le contexte de la page.
exemple
contentscript.js ( "run_at": "document_end" dans le manifeste):
var s = document.createElement('script');
s.src = chrome.extension.getURL('script.js');
(document.head||document.documentElement).appendChild(s);
s.onload = function() {
s.remove();
};
// Event listener
document.addEventListener('RW759_connectExtension', function(e) {
// e.detail contains the transferred data (can be anything, ranging
// from JavaScript objects to strings).
// Do something, for example:
alert(e.detail);
});
script.js - situé dans le répertoire d'extension, il sera injecté dans la page elle-même:
setTimeout(function() {
/* Example: Send data from the page to your Chrome extension */
document.dispatchEvent(new CustomEvent('RW759_connectExtension', {
detail: GLOBALS // Some variable from Gmail.
}));
}, 0);
puisque ce fichier est chargé via une extension chrome: URL depuis le DOM," script.js " doit être ajouté à la section web_accessible_resources du fichier manifest. Sinon, Chrome refusera de charger le fichier script.
vous devez exécuter aussi peu de logique que possible dans la page web, et gérer la plupart de votre logique dans le script de contenu. Cela a de multiples raisons. Tout d'abord, tout script injecté dans la page tourne dans le même contexte que la page web, de sorte que la page Web peut (délibérément ou par inadvertance) modifier les méthodes JavaScript/DOM de telle sorte que votre extension cesse de fonctionner. Deuxièmement, content script a accès à des fonctionnalités supplémentaires, comme un sous-ensemble limité du chrome.* Api et les demandes de réseau d'origine croisée (à condition que l'extension ait déclaré des permissions pour celles-ci).
une solution plus moderne pour communiquer entre une extension chrome content_script et le javascript sur la page serait d'utiliser l'API postMessage HTML5. Tous les messages envoyés à" window " sont visibles à partir du javascript sur la page Web et du content_script de l'extension.
le content_script de l'extension.js:
window.addEventListener('message', function(event) {
console.log('content_script.js got message:', event);
// check event.type and event.data
});
setTimeout(function () {
console.log('cs sending message');
window.postMessage({ type: 'content_script_type',
text: 'Hello from content_script.js!'},
'*' /* targetOrigin: any */ );
}, 1000);
le javascript qui s'exécute sur la page Web:
window.addEventListener('message', function(event) {
console.log('page javascript got message:', event);
});
setTimeout(function() {
console.log('page javascript sending message');
window.postMessage({ type: 'page_js_type',
text: "Hello from the page's javascript!"},
'*' /* targetOrigin: any */);
}, 2000);
Voir aussi http://developer.chrome.com/extensions/content_scripts.html#host-page-communication
il y a une nouvelle API pour les pages web pour communiquer en toute sécurité et sans effets secondaires (window.postMessage peut avoir d'autres auditeurs!) au script de contenu.
" à partir de la page web, utilisez le runtime.sendMessage ou runtime.connectez les API pour envoyer un message à une application ou une extension spécifique"
// The ID of the extension we want to talk to.
var editorExtensionId = "abcdefghijklmnoabcdefhijklmnoabc";
// Make a simple request:
chrome.runtime.sendMessage(editorExtensionId, {openUrlInEditor: url},
function(response) {
if (!response.success)
handleError(url);
});
" à partir de votre application ou extension, vous pouvez écouter les messages des pages web via l'exécution.onmessageexterneou runtime.onConnectExternal APIs, similaire à la messagerie inter-extension. Seule la page web peut initier une connexion. [...] "
(de http://developer.chrome.com/extensions/messaging.html ) Cela n'est encore disponible que sur le canal de développement de chrome, mais il semble que ce sera dans la prochaine version.
ne me demandez pas comment cela fonctionne, cela semble très confus. Comment diable fait chrome.runtime est défini sur la page web? Que faire si le script est déjà défini cette variable pour une raison quelconque? Je n'ai pas non plus trouvé le rapport de bug chromium pour voir l'historique du développement de cette fonctionnalité.
j'ai eu une approche légèrement différente basée sur les pages html accessibles de votre extension.
ajoutez votre page au manifeste:
"web_accessible_resources": ["variables.html"]créez votre page (Ici, variables.html) et extraire les données du contenu (c.-à-d. fenêtre.contentVar):
<script type="text/javascript">
$("#my-var-name").text(window["contentVar"]);
</script>
<div id="my-var-name" style="display: none;"></div>accès à partir de votre extension JavaScript:
var myVarName = $("#my-var-name").text();