File Writer onload function is not fired with Android ver 6.0



  • Hi ,
    I am working on a project with Onsen2 (monaca ver 2.1.7) with Angularjs 2.
    for a business requirement ,i am saving the image base64 as image in device using file plugin.

    The file got saved as image in Android version 4.4 (HTC one) and not able to save in version 6.0 in MotoG3 .

    After further analysis i found that the difference is while calling in Android 6 (motoG3) the code in the FIleWriter.js is not firing , due to which , i am getting the broken image in android version 6.0 devices , this is my finding and not sure about the cause.

    The problem is while testing with android version 4.4 the file is saving as complete image but when i test with higher version of android 6.0 the image is saved as broken image.

    i have tested the same with Onsenui2 with angular1.x and it is working fine.

    Please find the code details as below

    code used in business scope

    b64toBlob(b64Data, contentType, sliceSize) {
    console.log(“contentType–>”+contentType + " : sliceSize -->"+sliceSize);
    contentType = contentType || ‘’;
    sliceSize = sliceSize || 512;
    console.log(" sliceSize 12–>"+sliceSize);
    var byteCharacters = atob(b64Data);
    var byteArrays = [];
    for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
    var slice = byteCharacters.slice(offset, offset + sliceSize);
    var byteNumbers = new Array(slice.length);
    for (var i = 0; i < slice.length; i++) {
    byteNumbers[i] = slice.charCodeAt(i);
    }
    var byteArray = new Uint8Array(byteNumbers);
    byteArrays.push(byteArray);
    }
    var blob = new Blob(byteArrays, {type: contentType});
    return blob;

    }

    savebase64AsImageFile(folderpath,filename,content,contentType){
    // Convert the base64 string in a Blob
    var sliceSizeData = 512;
    var DataBlob = this.b64toBlob(content,contentType,sliceSizeData);

    console.log("Starting to write the file :3");
     console.log("folderpath :"+folderpath);
    

    try{
    window.resolveLocalFileSystemURL(folderpath, (dir)=> {
    console.log(“Access to the directory granted succesfully”);
    dir.getFile(filename, {create:true}, (file)=> {

            file.createWriter((fileWriter)=> {
                 console.log("Writing content to file");
                fileWriter.write(DataBlob);
                 console.log("File written sucessfully123"+file.fullPath);
                 console.log("File written sucessfully124"+file.nativeURL);
            
            }, function(){
                alert('Unable to save file in path '+ folderpath);
            });
        });
    });
    

    }catch(ex){

    console.log(“Error in data wrirting”+ex);

    }
    }

    FileWriter.js

    /**

    • Writes data to the file

    • @param data text or blob to be written

    • @param isPendingBlobReadResult {Boolean} true if the data is the pending blob read operation result
      */
      FileWriter.prototype.write = function(data, isPendingBlobReadResult) {
      console.log(“inside File reader onload function FileWriter.prototype.write”);
      var that=this;
      var supportsBinary = (typeof window.Blob !== ‘undefined’ && typeof window.ArrayBuffer !== ‘undefined’);
      var isProxySupportBlobNatively = (cordova.platformId === “windows8” || cordova.platformId === “windows”);
      var isBinary;

      // Check to see if the incoming data is a blob
      if (data instanceof File || (!isProxySupportBlobNatively && supportsBinary && data instanceof Blob)) {
      console.log(“inside File reader onload function2”);
      var fileReader = new FileReader();
      console.log(“inside File reader onload function3:”+fileReader);
      try{
      fileReader.onload = ()=> {
      console.log(“File reader onload function5”);
      // Call this method again, with the arraybuffer as argument
      FileWriter.prototype.write.call(that, this.result, true /* isPendingBlobReadResult */);
      };
      }catch(ex){
      console.log(“exception inside File reader fileReader.onerror”+ex);
      }
      fileReader.onerror = ()=> {
      console.log(“inside File reader fileReader.onerror:”);
      // DONE state
      that.readyState = FileWriter.DONE;

           // Save error
           that.error = this.error;
      

    console.log(“inside File reader fileReader.onerror22 :”+that.error);
    // If onerror callback
    if (typeof that.onerror === “function”) {
    that.onerror(new ProgressEvent(“error”, {“target”:that}));
    }

            // If onwriteend callback
            if (typeof that.onwriteend === "function") {
                that.onwriteend(new ProgressEvent("writeend", {"target":that}));
            }
        };
    
        // WRITING state
        this.readyState = FileWriter.WRITING;
    
        if (supportsBinary) {
            fileReader.readAsArrayBuffer(data);
        } else {
            fileReader.readAsText(data);
        }
        return;
    }
    
    // Mark data type for safer transport over the binary bridge
    isBinary = supportsBinary && (data instanceof ArrayBuffer);
    if (isBinary && cordova.platformId === "windowsphone") {
        // create a plain array, using the keys from the Uint8Array view so that we can serialize it
        data = Array.apply(null, new Uint8Array(data));
    }
    
    // Throw an exception if we are already writing a file
    if (this.readyState === FileWriter.WRITING && !isPendingBlobReadResult) {
        throw new FileError(FileError.INVALID_STATE_ERR);
    }
    
    // WRITING state
    this.readyState = FileWriter.WRITING;
    
    var me = this;
    
    // If onwritestart callback
    if (typeof me.onwritestart === "function") {
        me.onwritestart(new ProgressEvent("writestart", {"target":me}));
    }
    
    // Write file
    exec(
        // Success callback
        function(r) {
            // If DONE (cancelled), then don't do anything
            if (me.readyState === FileWriter.DONE) {
                return;
            }
    
            // position always increases by bytes written because file would be extended
            me.position += r;
            // The length of the file is now where we are done writing.
    
            me.length = me.position;
    
            // DONE state
            me.readyState = FileWriter.DONE;
    
            // If onwrite callback
            if (typeof me.onwrite === "function") {
                me.onwrite(new ProgressEvent("write", {"target":me}));
            }
    
            // If onwriteend callback
            if (typeof me.onwriteend === "function") {
                me.onwriteend(new ProgressEvent("writeend", {"target":me}));
            }
        },
        // Error callback
        function(e) {
            // If DONE (cancelled), then don't do anything
            if (me.readyState === FileWriter.DONE) {
                return;
            }
    
            // DONE state
            me.readyState = FileWriter.DONE;
    
            // Save error
            me.error = new FileError(e);
    
            // If onerror callback
            if (typeof me.onerror === "function") {
                me.onerror(new ProgressEvent("error", {"target":me}));
            }
    
            // If onwriteend callback
            if (typeof me.onwriteend === "function") {
                me.onwriteend(new ProgressEvent("writeend", {"target":me}));
            }
        }, "File", "write", [this.localURL, data, this.position, isBinary]);
    

    };


Log in to reply