最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Chrome Apps : How to save blob content to fileSystem in the background? - Stack Overflow

programmeradmin2浏览0评论

In Chrome Apps, I'm downloading a blob content from a server using JavaScript XHR (Angular $http GET in particular, with response type 'blob')

How should I save this to chrome application's file system?

Currently using an Angular wrapper on HTML5 filesystem API

I do not want to show user a popup (hence I can't use chrome.fileSystem. chooseEntry )

The chrome.fileSystem.requestFileSystem API is only supported by Kiosk-only apps. Hence I'm using HTML5 FileSystem API instead of chrome's.

I'm using following code to make XHR to fetch blob.

 $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) {

      });

This is my writeBlob method

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;
},

This shows SECURITY_ERR as 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.

What's the solution for this?

I've tried using --allow-file-access-from-files flag while launching app. It doesn't help.

In Chrome Apps, I'm downloading a blob content from a server using JavaScript XHR (Angular $http GET in particular, with response type 'blob')

How should I save this to chrome application's file system?

Currently using an Angular wrapper on HTML5 filesystem API https://github./maciel310/angular-filesystem

I do not want to show user a popup (hence I can't use chrome.fileSystem. chooseEntry )

The chrome.fileSystem.requestFileSystem API is only supported by Kiosk-only apps. Hence I'm using HTML5 FileSystem API instead of chrome's.

I'm using following code to make XHR to fetch blob.

 $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) {

      });

This is my writeBlob method

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;
},

This shows SECURITY_ERR as 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.

What's the solution for this?

I've tried using --allow-file-access-from-files flag while launching app. It doesn't help.

Share Improve this question edited Dec 30, 2015 at 14:34 Vishwajeet Vatharkar asked Dec 30, 2015 at 14:29 Vishwajeet VatharkarVishwajeet Vatharkar 1,2065 gold badges20 silver badges42 bronze badges 4
  • 1 When you say you don't want to show a popup.html do you just mean you don't want a popup to occur? Meaning you need the script to run from the tab being viewed on a click method? – wuno Commented Dec 30, 2015 at 17:40
  • I mean the video should be saved automatically in the background. it shouldn't prompt user where to save,which happens with choosEntry mefhod – Vishwajeet Vatharkar Commented Jan 1, 2016 at 5:01
  • did you accept the answer from the other question as n answer? – wuno Commented Jan 1, 2016 at 7:19
  • Do you have a match pattern giving you host permissions for SERVER_URL in the 'permissions' field of your manifest? (I can't recall off the top of my head if this is relevant for apps or not; it likely would be for an extension) – Antony Sargent Commented Jan 4, 2016 at 18:29
Add a ment  | 

2 Answers 2

Reset to default 5

Chrome Application's sandbox storage doesn't allow files to be stored in root directory (i.e. / )

Modify the code to save it in a specific sub-directory under it. For example -

fileSystem.writeBlob("/new"+response.name, response).then(function() {
             console.log("file saved");
          }, function(err) {
              console.log(err);
          });

This would successfully save the file under /new/ directory.

To expand on this, here is a full example app on how to download a file and save the blob and display it back to the user.

https://github./PierBover/chrome-os-app-download-example

发布评论

评论列表(0)

  1. 暂无评论