2012-09-12 9 views
14

Me gustaría hacer una extensión de Chrome que proporcione un nuevo objeto dentro de window. Cuando una página web se visualiza en un navegador con la extensión cargada, me gustaría que window.mything esté disponible a través de Javascript. El objeto window.mything tendrá algunas funciones que definiré en la extensión, y estas funciones deben poder llamarse desde console.log o cualquier archivo Javascript cuando la página se visualiza en un navegador con la extensión habilitada.¿Se puede modificar el objeto de ventana desde una extensión de Chrome?

que era capaz de inyectar con éxito un archivo JavaScript en la página mediante el uso de un Content Script:

var s = document.createElement("script"); 
s.src = chrome.extension.getURL("mything.js"); 
document.getElementsByTagName("head")[0].appendChild(s); 

mything.js se parece a esto:

window.mything = {thing: true}; 
console.log(window); 

Siempre que carga una página, veo el todo el objeto window como espero que esté en la consola. Sin embargo, no puedo interactuar con el objeto window.mything desde la consola. Parece que si el guión inyectado realmente no ha modificado el objeto global window.

¿Cómo puedo modificar el objeto global window desde una extensión de Chrome?

+0

Eso es imposible. ¿Está viendo la consola correcta, se está ejecutando realmente la secuencia de comandos (inspeccione el documento y busque la etiqueta de secuencia de comandos/compruebe si hay errores de sintaxis)? El script ciertamente se ejecuta en el contexto de la página, y por lo tanto, 'mything' debe existir. –

Respuesta

27

No puede, no directamente. Desde content scripts documentation:

Sin embargo, los scripts de contenido tienen algunas limitaciones. Ellos no pueden:

  • uso de cromo * API (a excepción de partes de chrome.extension)
  • Use variables o funciones definidas por las páginas de su extensión
  • Use variables o funciones definidas por páginas web o por otra. guiones de contenido

(énfasis añadido)

El window objeto que el script de contenido ve no es el mismo objeto window que ve la página.

Puede pasar mensajes a través del DOM, sin embargo, utilizando el método window.postMessage. Tanto el script de su página como el de contenido escuchan el mensaje , mensaje, y siempre que llame al window.postMessage desde uno de esos lugares, el otro lo recibirá. Hay un example of this en la página de documentación "Scripts de contenido".

editar: Puede agregar algunos métodos a la página inyectando un script desde el script de contenido. Todavía no sería capaz de comunicarse de vuelta con el resto de la extensión, sin embargo, sin necesidad de utilizar algo así como postMessage, pero al menos podría añadir algunas cosas a la página de window

var elt = document.createElement("script"); 
elt.innerHTML = "window.foo = {bar:function(){/*whatever*/}};" 
document.head.appendChild(elt); 
+0

Gracias, no usé su sugerencia textualmente, pero el concepto me ayudó a centrarme en el problema real. –

+0

U también puede usar eval ("window.foo = {bar: function() {/ * whatever * /}};"); – User

+0

@Usuario no, no puedo, solo lo probé. – cprcrack

4

He estado jugando con esta. Descubrí que puedo interactuar con el objeto ventana del navegador al incluir mi javascript en una ventana.location = call.

var myInjectedJs = "window.foo='This exists in the \'real\' window object';" 
window.location = "javascript:" + myInjectedJs; 

var myInjectedJs2 = "window.bar='So does this.';" 
window.location = "javascript:" + myInjectedJs2; 

Funciona, pero solo para la última instancia de window.location que se está configurando. Si accede a objeto de la ventana del documento, que tendrá un "bar" variable, pero no "foo"

0

Scripts contenido puede llamada window métodos que luego pueden ser utilizados para mutar el objeto window. Esto es más fácil que la inyección de etiqueta <script> y funciona incluso cuando <head> y <body> aún no se han analizado (por ejemplo, al usar run_at: document_start).

// In Content Script 
window.addEventListener('load', loadEvent => { 
    let window = loadEvent.currentTarget; 
    window.document.title='You changed me!'; 
}); 
0

content_script carreras de una extensión de Chrome dentro de su propio contexto que está separado de la ventana. Se puede inyectar un script en la página aunque por lo que se ejecuta en el mismo contexto que la ventana de la página, así: Chrome extension - retrieving global variable from webpage

pude llamar a métodos en el objeto de la ventana y modificar propiedades de la ventana añadiendo esencialmente un script.js a la DOM de la página:

var s = document.createElement('script'); 
s.src = chrome.extension.getURL('script.js'); 
(document.head||document.documentElement).appendChild(s); 
s.onload = function() { 
    s.remove(); 
}; 

y la creación de los detectores de eventos personalizados en ese archivo de comandos inyectada:

document.addEventListener('_my_custom_event', function(e) { 
    // do whatever you'd like! Like access the window obj 
    window.myData = e.detail.my_event_data; 
}) 

y el envío de ese evento en el content_script:

var foo = 'bar' 
document.dispatchEvent(new CustomEvent('_save_OG_Editor', { 
    'detail': { 
    'my_event_data': foo 
    } 
})) 

o viceversa; Envíe eventos en script.js y escúchelos en el content_script de su extensión (como el enlace anterior ilustra bien).

Simplemente asegúrese de agregar su script insertado dentro de los archivos de su extensión, y agregue la ruta del archivo de script a su manifest within "web_accessible_resources" o obtendrá un error.

Espero que ayude a alguien \ (• ◡ •)/

Cuestiones relacionadas