¿Hay alguna manera de cargar un archivo JS local dinámicamente?

Para fines de desarrollo, me gustaría ser capaz de cargar fácilmente scripts almacenados localmente en el navegador en lugar de tener que copiar y pegar a la consola.¿Hay alguna manera de cargar un archivo JS local dinámicamente?

Al crear un nuevo elemento <script> no funciona, se produce un error Not allowed to load local resource: file://.... (en Chrome).

Además, crear un userscript no funcionará, tendré que volver a instalarlo cada vez que realice una edición.

¿Hay una manera alternativa de cargar fácilmente un script local a través de un bookmarklet/etc?

Fuente

2012-05-16 Manishearth

Si podemos ramificarnos fuera de JavaScript y el navegador, aquí, quizás sirva su script en un servidor local (¿quizás está haciendo un desarrollo local)? Puede iniciar un servidor local con una línea de Python. – cheeken

@cheeken: Sí, en realidad es una buena idea. Tengo instalado Apache, y de todos modos desarrollo en la carpeta Apache, ¡así que es una gran alternativa! – Manishearth

En Chrome, puede crear una extensión que contiene toda de los archivos locales que necesita cargar. Esto hará que sus archivos accesibles a través de chrome-extension://... en lugar de file://...

Hacer un archivo llamado manifest.json en una nueva carpeta y llenarlo con:

{ 
    "name": "File holder", 
    "manifest_version": 2, 
    "version": "1.0", 
    "web_accessible_resources": ["test.js", "other.js", "yetanother.js"] 
}

A continuación, poner todos los guiones que desea cargar en ese nuevo directorio y asegúrese de que estén incluidos en la lista de manifiestos web_accessbile_reources. Cargue la extensión yendo a chrome://extensions, habilitando Developer Mode, y seleccionando la nueva carpeta con Load unpacked extension....

Ahora puede acceder a todos los archivos en su directorio de extensión usando chrome-extension://[app_id]/[file_name], donde "app_id" es el hash listado para la extensión en la página chrome://extensions. Tenga en cuenta que debido a que los protocolos y nombres de host difieren de donde realiza su trabajo real (a menos que decida hacer todo su desarrollo en la carpeta de extensiones, lo que podría ser aceptable para usted), los recursos de extensión son de dominio cruzado y solo pueden cargado a través de la etiqueta <script>.

Ahora desde la consola, que puede hacer:

var s = document.createElement("script"); 
s.src = "chrome-extension://aefigdoelbemgaedgkcjpcnilbgagpcn/test.js"; 
document.body.appendChild(s);

(Asumiendo que su archivo es test.js y su identificador de aplicación es aefigdoelbemgaedgkcjpcnilbgagpcn.)

Es un poco bastante para escribir, lo sé, pero tal vez puede almacenar la parte chrome-extension://[app_id] como una variable abreviada?

Fuente

2012-05-16 05:04:05 apsillers

Intenté hacer esto con Chrome 22, y mostró una advertencia de que la compatibilidad con la versión 1 manifiesta se está eliminando. La documentación sobre los cambios en v2 incluye "Los recursos de un paquete ya no están disponibles de forma predeterminada en sitios web externos (como el src de una imagen o una etiqueta de script).Si desea que un sitio web pueda cargar un recurso contenido en su paquete, deberá incluirlo explícitamente en la lista blanca a través del atributo de manifiesto web_accessible_resources. Esto es particularmente relevante para las extensiones que crean una interfaz en un sitio web a través de scripts de contenido inyectado. "Sospecho que necesitaremos esto. – Barmar

Una vez que cargue el archivo de script, ¿cómo lo uso? Mi archivo .js contiene un solo encabezado -la definición de la función de nivel, pero cuando trato de llamarlo en la consola de Javascript, dice que no está definido. – Barmar

@Barmar: Esta respuesta se escribió antes de que la versión de manifiesto 2 se utilizara ampliamente. Gracias por el aviso; Lo corregiré ahora – apsillers

-1

Ha intentado una ruta relativa desde su página a su archivo js liek así que ...

src = '/ js/javascript.js'

Fuente

2012-05-16 05:03:58 JDev

No funciona, estoy desarrollando un userscript; de lo contrario, ¿por qué copiar y pegar en la consola en primer lugar? – Manishearth

Lamentablemente, Chrome doesn't allow you to load local files via AJAX; sin embargo, puede evitar esta limitación al iniciar el navegador con el indicador --disable-web-security (los detalles varían según el sistema operativo del host).

Fuente

2012-05-16 05:09:12 maerics

¿Puedo sugerir '--allow-file-access-from-files' en su lugar? Eso permitirá que todas las otras características de seguridad web se mantengan vigentes y (creo) aún consigan el resultado deseado. – apsillers

Encontrar interesante, pero [esta respuesta SO] (http://stackoverflow.com/a/4271569/244128) plantea algunas dudas sobre la eficacia de esa función en función de sus [cuestiones destacadas] (http://code.google.com/p/chromium/issues/detail? id = 4197 & can = 1 & q = allow-file-access-from-files & colspec = ID% 20Stars% 20Pri% 20Area% 20Feature% 20Type% 20Status% 20Summary% 20Modified% 20Owner% 20Mstone% 20OS). – maerics

Lo que no entiendo es que de alguna manera $ .getScript funciona. – njzk2

¿Hay alguna manera de cargar un archivo JS local dinámicamente?

Respuesta

Cuestiones relacionadas