Convertir URL a Archivo o Blob para FileReader.readAsDataURL

Referencia: FileReader.readAsDataURL

Considerando el siguiente ejemplo: 

function previewFile(file) {

  var reader  = new FileReader();

  reader.onloadend = function () {
    console.log(reader.result);
  }
  reader.readAsDataURL(file);
}

Dice:

InstanceOfFileReader.readAsDataURL(blob);

Blob: El Blob o Archivo desde el que leer.

  1. ¿Cómo puede ser una URL de archivo local como: 'file:///C:/path-to/root.png' pasado a la readAsDataURL()

  2. ¿FileReader() está disponible en un complemento de Firefox?

Author: erosman, 2014-07-31
Source

3 answers

  1. Puede crear File instances simplemente especificando una ruta cuando su código tiene privilegios de chrome: 

    new File("/path/to/file");

    File es una subclase de Blob, por lo que todas las instancias File también son válidas Blob. Tenga en cuenta que esto requiere una ruta de la plataforma, y no una URL de archivo.

  2. Sí, FileReader está disponible para complementos.

File y FileReader están disponibles en todos los windows. Si desea usarlos en un ámbito que no sea ventana (como bootstrap.js o un módulo de código), puede utilizar nsIDOMFile/nsIDOMFileReader.

 18
Author: nmaier,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-07-07 22:32:36

Para convertir una URL en un Blob para FileReader.readAsDataURL () haga esto: 

var request = new XMLHttpRequest();
request.open('GET', MY_URL, true);
request.responseType = 'blob';
request.onload = function() {
    var reader = new FileReader();
    reader.readAsDataURL(request.response);
    reader.onload =  function(e){
        console.log('DataURL:', e.target.result);
    };
};
request.send();
 19
Author: Felix Turner,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-01-19 21:37:05

Prueba esto Aprendí esto de @nmaier cuando estaba jugando con la conversión a ico: Bueno, realmente no entiendo qué es array buffer, pero hace lo que necesitamos:

function previewFile(file) {

  var reader  = new FileReader();

  reader.onloadend = function () {
    console.log(reader.result); //this is an ArrayBuffer
  }
  reader.readAsArrayBuffer(file);
}

Observe cómo acabo de cambiar su readAsDataURL a readAsArrayBuffer.

Aquí está el ejemplo que @nmaier me dio: https://stackoverflow.com/a/24253997/1828637

Tiene un violín

Si quieres tomar esto y hacer un archivo con él, creo que usarías file-output-stream en el onloadend

 11
Author: Noitidart,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 11:55:07