La inyección de funciones JS en la página de un script de Greasemonkey en Chrome

Question

Tengo un script de Greasemonkey que funciona bien en Firefox y Opera. Lucho con conseguir que funcione en Chrome, sin embargo. El problema es la inyección de una función en la página que puede ser invocado por el código de la página. Esto es lo que estoy haciendo hasta ahora:

En primer lugar, obtener una referencia de ayuda a la unsafeWindow para Firefox. Esto me permite tener el mismo código para FF y Opera (y Chrome, pensé).

var uw = (this.unsafeWindow) ? this.unsafeWindow : window;

A continuación, se inyecta una función en la página. Es realmente sólo un envoltorio muy delgada que no hace más que invocar la función correspondiente en el contexto de mi guión GM:

uw.setConfigOption = function(newValue) {
    setTimeout(setConfigOption, 0, newValue);
}

A continuación, está el derecho correspondiente función en mi script:

setConfigOption = function(newValue) {
    // do something with it, e.g. store in localStorage
}

pasada, inyectar algo de HTML en la página con un enlace para invocar la función.

var p = document.createElement('p');
p.innerHTML = '<a href="javascript:setConfigOption(1)">set config option to 1</a>';
document.getElementById('injection-point').appendChild(p);

Para resumir: En Firefox, cuando el usuario hace clic, lo que inyectaba enlace, se ejecutará la llamada de función en la unsafeWindow, lo cual dispara un tiempo de espera que se invoca la función correspondiente en el contexto de mi script de GM, que luego hace el procesamiento real. (Corríjanme si me equivoco aquí.)

En Chrome, que acaba de obtener un Error "no detectada ReferenceError setConfigOption no está definido". Y, en efecto, la introducción de "window.setConfigOption" en la consola produce un "indefinido". En Firebug y la consola de desarrolladores de Opera, la función está ahí.

Tal vez hay otra manera de hacer esto, pero algunos de mis funciones se invocan por un objeto Flash en la página, que creo que hace necesario que desempeñen funciones en el contexto de la página.

Me dio un rápido vistazo a la a unsafeWindow en el wiki de Greasemonkey, pero todos se parecen bastante feo. ¿Estoy completamente en el camino equivocado aquí o debería mirar más de cerca a estos?

Solución: I seguido Max S.' consejos y funciona en Firefox y Chrome ahora. Debido a las funciones que tenía que estar a disposición de la página tuvieron que llamar de nuevo en las normales, que se trasladó toda mi guión a la página, es decir que está completamente envuelto en la función que llamó 'main ()'.

Para hacer que la fealdad adicional de que piratear un poco más soportable, al menos podría caer el uso de unsafeWindow y wrappedJSObject ahora.

Todavía no han logrado obtener la href="http://wiki.greasespot.net/Content_Scope_Runner" rel="noreferrer"> contenido corredor alcance <a> en la página, por ejemplo. Todavía no he descubierto por qué es así.

Answer 1

La única manera de comunicarse con el código que se ejecuta en la página en Chrome es a través del DOM, por lo que tendrá que utilizar un truco como la inserción de una etiqueta <script> con su código. Tenga en cuenta que esto puede resultar cochecito si sus necesidades script para ejecutar antes que nada en la página.

EDIT: Así es como la extensión Alerta de Niza hace esto:

function main () {
  // ...
  window.alert = function() {/* ... */};
  // ...
}

var script = document.createElement('script');
script.appendChild(document.createTextNode('('+ main +')();'));
(document.body || document.head || document.documentElement).appendChild(script);

Answer 2

tengo esto:

contentscript.js:

function injectJs(link) {
var scr = document.createElement('script');
scr.type="text/javascript";
scr.src=link;
document.getElementsByTagName('head')[0].appendChild(scr)
//document.body.appendChild(scr);
}

injectJs(chrome.extension.getURL('injected.js'));

injected.js:

function main() {
     alert('Hello World!');
}

main();

Answer 3

  

Me dio un rápido vistazo a las alternativas href="http://wiki.greasespot.net/Category%3aCoding_Tips%3aInteracting_With_The_Page" rel="nofollow a unsafeWindow en el wiki de Greasemonkey, pero todos ellos parecen bastante fea. ¿Estoy completamente en el camino equivocado aquí o debería mirar más de cerca a estos?

Se debe mirar, porque es la única opción disponible. Yo prefiero usar ubicación truco .

myscript.user.js:

function myFunc(){
  alert('Hello World!');
}

location.href="javascript:(function(){" + myFunc + "})()"

example.com/mypage.html

<script>
myFunc() // Hello World!
</script>

Claro, es feo. Pero está funcionando bien.

---

Contenido Ámbito método Runner, citado por Max S. es mejor que la ubicación de corte, debido a que es más fácil de depurar.

Answer 4

Las otras respuestas o bien te obligan a usar expresiones de función , importar un archivo adicional externo o utilizar un largo parcheado truco .

Esta respuesta va a añadir el JavaScript en la página directamente desde el código fuente. Se utilizará ECMAScript 6 (ES6) plantilla literales para obtener la cadena de JavaScript multilínea sin esfuerzo hasta la página.

var script = document.createElement('script'); 
script.type = "text/javascript"; 
script.innerHTML = ` 
   function test() {
      alert(1);
   }
`;
document.getElementsByTagName('head')[0].appendChild(script);

Tenga en cuenta el invertidas `` que definen el principio y el final de una cadena de múltiples líneas.