tipos - pasar parametros a una funcion javascript desde html
UserScripts & Greasemonkey: llamar a las funciones de JavaScript de un sitio web (2)
Estoy creando una extensión UserScript para Firefox y Chrome y estoy tratando de usar parte del código en el JavaScript del sitio web, por ejemplo:
function: myFunction(){
return Grooveshark.playNextSong();
}
El problema es cuando pruebo este código, Grooveshark
es una referencia nula.
Sé que hay otras personas que lo han hecho:
Pero no sé por qué mi extensión simple no puede llamar a las funciones de JavaScript de Grooveshark.
¿Debo ''agregar'' mi script al documento para que funcione ?: document.document.body.appendChild(script);
¿Ya Greasemonkey no inyecta mis extensiones de JavaScript? ¿Alguien puede aclarar esto por mí, por favor?
Gracias.
Fondo
¿Ya Greasemonkey no inyecta mis extensiones de JavaScript? ¿Alguien puede aclarar esto por mí, por favor?
Greasemonkey ejecuta sus scripts en un sandbox , que es un entorno restringido sin acceso directo al JavaScript en la página. Versiones anteriores de Greasemonkey inyectaron scripts directamente en la página, pero esto introdujo serias vulnerabilidades de seguridad. En el modelo anterior, los scripts se ejecutaban con los derechos elevados del navegador chrome, lo que permitía que las páginas remotas accedieran a las funciones integradas de Greasemonkey utilizando un código JavaScript inteligente . Esto fue malo:
Las secuencias de comandos de Greasemonkey contenían su propio objeto GM_xmlhttprequest que, a diferencia de un objeto xmlttprequest normal, podía acceder a cualquier archivo local de una computadora o realizar solicitudes arbitrarias a sitios arbitrarios sin tener en cuenta la misma política de origen que normalmente se aplica a xmlhttprequest. (source)
Cuando accedes al objeto window
desde un script de Greasemonkey hoy, lo que obtienes es un objeto envoltorio que hace referencia indirectamente a las propiedades reales de la window
. Este objeto contenedor se puede modificar de forma segura, pero tiene limitaciones importantes . El acceso al objeto de ventana real es provisto por unsafeWindow
(abreviatura de window.wrappedJSObject
). El uso de unsafeWindow
vuelve a abrir todos los problemas de seguridad originales de Greasemonkey y no está disponible en Chrome. Debe evitarse siempre que sea posible.
La buena noticia es que hay al menos dos formas de trabajar con el nuevo modelo de seguridad de Greasemonkey de forma segura.
Inyección de scripts
Ahora que los scripts de Greasemonkey pueden acceder de manera segura al DOM, es trivial inyectar una etiqueta <script>
en el <head>
del documento de destino. Crea una función como esta:
function exec(fn) {
var script = document.createElement(''script'');
script.setAttribute("type", "application/javascript");
script.textContent = ''('' + fn + '')();'';
document.body.appendChild(script); // run the script
document.body.removeChild(script); // clean up
}
Es simple de usar:
exec(function() {
return Grooveshark.playNextSong();
});
Localización Hack
La inyección de scripts puede ser excesiva en algunos casos, especialmente cuando todo lo que necesita es modificar el valor de una variable en la página o ejecutar una sola función. El Local Hack aprovecha javascript:
URL para acceder al código en el contenido del documento. Es muy parecido a ejecutar un bookmarklet desde un script de Greasemonkey.
location.assign("javascript:Grooveshark.playNextSong();void(0)");
Script de bonificación
Aquí hay una secuencia de comandos completa de Greasemonkey que demuestra los ejemplos anteriores. Puede ejecutarlo en esta página.
// ==UserScript==
// @name Content Function Test
// @namespace lwburk
// @include http://.com/questions/5006460/userscripts-greasemonkey-calling-a-websites-javascript-functions
// ==/UserScript==
function exec(fn) {
var script = document.createElement(''script'');
script.setAttribute("type", "application/javascript");
script.textContent = ''('' + fn + '')();'';
document.body.appendChild(script); // run the script
document.body.removeChild(script); // clean up
}
window.addEventListener("load", function() {
// script injection
exec(function() {
// alerts true if you''re registered with
alert(''registered? '' + isRegistered);
});
// location hack
location.assign("javascript:alert(''registered? '' + isRegistered);void(0)");
}, false);
Las funciones y variables declaradas en sus scripts de GreaseMonkey (y las secuencias de comandos de usuario de Chrome) se mantienen separadas de las declaradas por la página web, por razones obvias. Para los scripts de GM en Firefox, puede acceder a variables globales a través de unsafeWindow
.
El mejor enfoque para la seguridad y la compatibilidad es inyectar sus funciones en la página utilizando un elemento script. Uso el siguiente fragmento en mis scripts de usuario:
function addFunction(func, exec) {
var script = document.createElement("script");
script.textContent = "-" + func + (exec ? "()" : "");
document.body.appendChild(script);
}
El "-"
aquí asegura que la función se analiza como una expresión para que el exec
pueda ejecutarse inmediatamente al agregarlo. Llamas a la función así:
function myFunction () {
return Grooveshark.playNextSong();
}
// Inject the function and execute it:
addFunction(myFunction, true);