title: Chrome Apps : How to save blob content to fileSystem in the background?
body: <p>In Chrome Apps, I'm downloading a blob content from a server using JavaScript XHR (Angular $http GET in particular, with response type 'blob')</p>
  
  <p>How should I save this to chrome application's file system?</p>
  
  <p>Currently using an Angular wrapper on HTML5 filesystem API
  <a href="https://github.com/maciel310/angular-filesystem" rel="noreferrer">https://github.com/maciel310/angular-filesystem</a></p>
  
  <p>I do not want to show user a popup (hence I can't use <code>chrome.fileSystem. chooseEntry</code> )</p>
  
  <p>The <code>chrome.fileSystem.requestFileSystem</code> API is only supported by Kiosk-only apps.
  Hence I'm using HTML5 FileSystem API instead of chrome's.</p>
  
  <p>I'm using following code to make XHR to fetch blob.</p>
  
  <pre><code> $http({
            url: SERVER_URL+"/someVideo.mp4",
            method: "GET",
            responseType: "blob"
        }).then(function(response) {
            console.log(response);
            fileSystem.writeBlob(response.name, response).then(function() {
               console.log("file saved");
            }, function(err) {
                console.log(err);
            });
        }, function (response) {
  
        });
  </code></pre>
  
  <p>This is my writeBlob method</p>
  
  <pre><code>writeBlob: function(fileName, blob, append) {
      append = (typeof append == 'undefined' ? false : append);
  
      var def = $q.defer();
  
      fsDefer.promise.then(function(fs) {
  
          fs.root.getFile(fileName, {create: true}, function(fileEntry) {
  
              fileEntry.createWriter(function(fileWriter) {
                  if(append) {
                      fileWriter.seek(fileWriter.length);
                  }
  
                  var truncated = false;
                  fileWriter.onwriteend = function(e) {
                      //truncate all data after current position
                      if (!truncated) {
                          truncated = true;
                          this.truncate(this.position);
                          return;
                      }
                      safeResolve(def, "");
                  };
  
                  fileWriter.onerror = function(e) {
                      safeReject(def, {text: 'Write failed', obj: e});
                  };
  
                  fileWriter.write(blob);
  
              }, function(e) {
                  safeReject(def, {text: "Error creating file", obj: e});
              });
  
          }, function(e) {
              safeReject(def, {text: "Error getting file", obj: e});
          });
  
      }, function(err) {
          def.reject(err);
      });
  
      return def.promise;
  },
  </code></pre>
  
  <p>This shows <code>SECURITY_ERR</code> as <code>It was determined that certain files are unsafe for access within a Web application, or that too many calls are being made on file resources.</code></p>
  
  <p>What's the solution for this?</p>
  
  <p>I've tried using <code>--allow-file-access-from-files</code> flag while launching app. It doesn't help.</p>