Read File as Array From SD Card in cordova (ionic)

问题:

I use audio files in my app that I need to get as an buffer array. For this I let the user choose a file (using Ionic/Cordova FileChooser Plugin) and then I get an URL like:

content://com.android.providers.media.documents/document/audio%3A8431

After that, I sent this to Cordova Plugin File resolveNativePath function and I get a Path Like:

file:///storage/emulated/0/Prueba interno/Interno, Teddybär, Dreh Dich Um__320kbps.mp3

Here I make my audioFileInfo Object

audioFileInfo = {name: "Interno, Teddybär, Dreh Dich Um__320kbps.mp3",
                 originalPath: "content://com.android.providers.media.documents/document/audio%3A8431",
                  path: "file:///storage/emulated/0/Prueba interno"}

and finally I call filePlugin.readAsArrayBuffer(audioFileInfo.path, audioFileInfo.name) to get the buffer array.

It works ok when the file is in the device internal storage, but when the file comes from the SDCard it does not work because the readAsArrayBuffer returns "not found".

SD Card:

File Chooser URL

content://com.android.externalstorage.documents/document/3D91-1C14%3AM%C3%BAsica%20Dana%2F1%20-%20Teddyb%C3%A4r%2C%20Teddyb%C3%A4r%2C%20Dreh%20Dich%20Um__320kbps.mp3

resolveNativePath:

file:///sdcard/Música Dana/1 - Teddybär, Teddybär, Dreh Dich Um__320kbps.mp3

audioFileInfo:

audioFileInfo = {
    name :"1 - Teddybär, Teddybär, Dreh Dich Um__320kbps.mp3"
    originalPath : "content://com.android.externalstorage.documents/document/3D91-1C14%3AM%C3%BAsica%20Dana%2F1%20-%20Teddyb%C3%A4r%2C%20Teddyb%C3%A4r%2C%20Dreh%20Dich%20Um__320kbps.mp3",
    path : "file:///sdcard/Música Dana"
}

readAsArrayBuffer:

FileError {code: 1, message: "NOT_FOUND_ERR"}

I have tried FilePlugins's resolveLocalFilesystemUrl() and I get this Entry object:

{
    filesystem: {
        name: "content",
        root: {
            filesystem {
                name: "content",
                root: "...."
            }
        },

        fullPath: "/",
        isDirectory: true,
        isFile: false,
        name: "",
        nativeURL: "content://",
    },
    fullPath: "/com.android.externalstorage.documents/document/3D91-1C14:Música Dana/1 - Teddybär, Teddybär, Dreh Dich Um__320kbps.mp3",
    isDirectory: false,
    isFile: true,
    name: "1 - Teddybär, Teddybär, Dreh Dich Um__320kbps.mp3",
    nativeURL: "content://com.android.externalstorage.documents/document/3D91-1C14%3AM%C3%BAsica%20Dana%2F1%20-%20Teddyb%C3%A4r%2C%20Teddyb%C3%A4r%2C%20Dreh%20Dich%20Um__320kbps.mp3",
}

Bue I have no idea what to use as path in the first parameter of the readAsArrayBuffer function.

If I use fullPath and name it throws encoding error. If I get just the "path" without the name from fullPath, it also throws encoding error.

Does anybody had a similar experience?

回答1:

I ended up making my own FileReader to process the file with the info returned by resolveLocalFilesystemUrl, Please be aware that this code uses Typescript

let entry = await this.filePlugin.resolveLocalFilesystemUrl(audioFileInfo.originalPath);
 let fileEntry: FileEntry = entry as FileEntry;

 console.log("fileEntry", fileEntry);

 let readFilePromise = new Promise < any > (resolve => {
     console.log("getting File from fileEntry");
     // fileEntry.getMetadata(data => {
     //     console.error("metadata", data); 
     // });
     fileEntry.file((file) => {
         console.log("File", file);
         var reader = new FileReader();

         reader.onloadend = () => {
             console.log("Successful file read: ", reader.result);
             resolve(reader.result);
         };

         reader.onprogress = (progressEvent) => {

             let fileUpdateInfo: FileLoadingUpdateInfo = {
                 audioFileInfo: audioFileInfo,
                 total: progressEvent.total,
                 loaded: progressEvent.loaded,
                 percent: parseFloat((progressEvent.loaded * 100 / progressEvent.total).toFixed(2))
             }
             this.updateAudioFileLoadingText$.next(fileUpdateInfo);
         };
         reader.onerror = (e) => {
             console.error("The reader had a problem", e)
             resolve(undefined);
         }
         reader.onabort = (e) => {
             console.error("We aborted...why???", e)
             resolve(undefined);
         }
         console.log("using reader to readAsArrayBuffer ");
         reader.readAsArrayBuffer(file);


     }, (e) => {
         console.error(e)
     });
 });
 let fileBufferArray = await readFilePromise;
 console.log("fileBufferArray", fileBufferArray);

 return fileBufferArray;