Pregunta

Actualmente estoy creando una extensión para Google Chrome que puede guardar todas las imágenes o enlaces a imágenes en el disco duro.

El problema es que no sé cómo guardar archivos en el disco con JS o con la API de Google Chrome Extension.

¿Usted tiene una idea?

¿Fue útil?

Solución

Puede utilizar FileSystem de HTML5 características a escribir en el disco utilizando la < a href = "http://updates.html5rocks.com/2011/08/Downloading-resources-in-HTML5-a-download" rel = "noreferrer"> Descargar API. Esa es la única manera de descargar archivos en el disco y que está limitado.

Se puede echar un vistazo a NPAPI plugin. Otra forma de hacer lo que necesita es simplemente enviar una petición a un sitio web externo a través de XHR POST y luego otra petición GET para recuperar la parte de atrás de archivos que aparecerá como un cuadro de diálogo Guardar archivo.

Por ejemplo, para mi extensión del navegador Mi Hangouts creé una utilidad para descargar una foto de HTML5 Canvas directamente en el disco. Usted puede tomar un vistazo al código aquí capture_gallery_downloader.js el código que hace es decir:

var url = window.webkitURL || window.URL || window.mozURL || window.msURL;
var a = document.createElement('a');
a.download = 'MyHangouts-MomentCapture.jpg';
a.href = url.createObjectURL(dataURIToBlob(data.active, 'jpg'));
a.textContent = 'Click here to download!';
a.dataset.downloadurl = ['jpg', a.download, a.href].join(':');

Si desea que la aplicación de convertir un URI a un Blob en HTML5 aquí es cómo lo hice:

/**
 * Converts the Data Image URI to a Blob.
 *
 * @param {string} dataURI base64 data image URI.
 * @param {string} mimetype the image mimetype.
 */
var dataURIToBlob = function(dataURI, mimetype) {
  var BASE64_MARKER = ';base64,';
  var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
  var base64 = dataURI.substring(base64Index);
  var raw = window.atob(base64);
  var rawLength = raw.length;
  var uInt8Array = new Uint8Array(rawLength);

  for (var i = 0; i < rawLength; ++i) {
    uInt8Array[i] = raw.charCodeAt(i);
  }

  var bb = new this.BlobBuilder();
  bb.append(uInt8Array.buffer);
  return bb.getBlob(mimetype);
};

A continuación, después el usuario hace clic en el botón de descarga, se utilizarán la API de "descarga" de archivos HTML 5 para descargar el blob URI en un archivo.

Otros consejos

Durante mucho tiempo había estado deseando hacer una extensión de Chrome para mí para descargar imágenes por lotes. Sin embargo, cada vez que se frustró porque la opción sólo en apariencia es aplicable NPAPI, que tanto Chrome y Firefox no parecen tener el deseo de apoyar por más tiempo.

Sugiero aquellos que todavía quería implementar '¡Parada en archivos en el disco' funcionalidad para echar un vistazo a este Stackoverflow posterior , el comentario más abajo este post me ayuda mucho.

Ahora bien, como el cromo 31+, la API chrome.downloads se volvió estable. Podemos utilizarlo para descargar archivos mediante programación. Si el usuario no ha configurado la opción de avance ask me before every download en cromo entorno, podemos guardar el archivo sin preguntar al usuario que confirme!

Esto es lo que yo uso (al fondo de la página de extensión):

    // remember to add "permissions": ["downloads"] to manifest.json
    // this snippet is inside a onMessage() listener function
    var imgurl = "https://www.google.com.hk/images/srpr/logo11w.png";
    chrome.downloads.download({url:imgurl},function(downloadId){
        console.log("download begin, the downId is:" + downloadId);
    });

A pesar de que es una lástima que Chrome todavía no proporciona un Event cuando la función de devolución de llamada del completes.chrome.downloads.download descarga se llama cuando el begin descarga con éxito (no en completarse)

La documentación oficial sobre chrome.downloadsis aquí .

No es mi idea original de la solución, pero he publicado aquí con la esperanza de que pueda ser de alguna utilidad para alguien.

No hay manera que yo conozco para guardar archivos en silencio duro del usuario, que es lo que parece que usted está esperando para hacerlo. Creo que se puede pedir archivos para ser salvo uno a la vez (preguntar al usuario cada vez) usando algo como:

function saveAsMe (filename)
{
document.execCommand('SaveAs',null,filename)
}

Si usted quiere solamente solicitan al usuario la vez, se puede agarrar todas las imágenes en silencio, comprímalos en un paquete, entonces la descarga de usuario que. Esto podría significar hacer XmlHttpRequest en todos los archivos, comprimirlos en Javascript, cargarlas a un área de ensayo, y luego preguntar al usuario si desea descargar el archivo zip. Suena absurdo, lo sé.

Hay opciones de almacenamiento local en el navegador, pero son sólo para uso de los desarrolladores, dentro del recinto de seguridad, por lo que yo sé. (Por ejemplo, el almacenamiento en caché Gmail sin conexión.) Ver los recientes anuncios de Google como éste .

Considere el uso de la FileSystem de HTML5 ofrece que la escritura hace a los ficheros posibles usando javascript.

Google Webstore
Github

Me hizo una extensión que hace algo como esto, si alguien aquí todavía está interesado. Utiliza un XMLHTTPRequest para agarrar el objeto, que en este caso se presume que es una imagen, entonces hace un ObjectURL a ella, un enlace a ese ObjectURL, y hace clic en el enlace imaginario.

Desde Javascript enganche-excursiones a su ordenador con las páginas web desde casi en cualquier lugar , que sería peligroso para darle la capacidad de escribir en el disco.

No está permitido. ¿Usted está pensando que la extensión de Chrome requiere la interacción del usuario? De lo contrario podría caer en la misma categoría.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top