How to save a image to HTML5 filesystem with the url of image

Question

I am trying to use HTML5 system to store images of my website, and I find there are many example to show how to store a local image to your chrome file system but I can\'t f

Answer 1

The trick is to use xhr.responseType = 'blob'

var fs = .... // your fileSystem
function download(fs,url,file,win,fail) {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', url);
  xhr.responseType = "blob";
  xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
      if(xhr.status === 200){
        fs.root.getFile(file,{create:true},function(fileEntry){
          fileEntry.createWriter(function(writer){
            writer.onwriteend = win;
            writer.onerror = fail;
            writer.write(xhr.response);
          })
        },fail)
      } else {
        fail(xhr.status);
      }
    }
  };
  xhr.send();
  return xhr;
};

Based on cordova-promise-fs (disclosure: I'm the author)