Ionic 3 File Permissions

Question

Alright, here goes. I'm dealing with an ionic project. In this specific scenario we're dealing with testing the Android version of the app. I can get images from the file system just fine, they come back in the form of a string url that looks something like this,

content://com.android.providers.media.documents/document/image%3A5744

The processor that is then supposed to blob the file and pass it up the line looks like this:

return this.file.readAsArrayBuffer(urlData.url, urlData.fileName)
  .then((item) => {
      return new Blob([new Uint8Array(item)]);
  })
  .catch((err) => {
    console.log(err.message)
  }).then((res)=>{
    return new Blob([res])
  })

But then I get the error SECURITY_ERR, which the documentation doesn't really talk about.

This works just fine for the pictures I take with the camera, which all have urls that look like this

file:///storage/emulated/0/Android/data/<appname>/cache/1502211622334.jpg

The issue is, as far as i can find, there is no documentation on what causes this error. I have no idea what to change to make my code work. I have verified the URI is valid, using the checkFile method.

Answer 1

So it turns out you can't use content urls with file.readAsArrayBuffer instead you have to first resolve the url into something readAsArrayBuffer can understand. To do this, i used the ionic native filePath plugin.

Once it was installed and included in the page where I needed it, I used the

filePath.resolveNativePath(url)

method on my url, since this returns a promise, I chained my readAsArrayBuffer onto a then statement prepended to it. I did have to use an if statement to have branching paths for content urls (Which required resolveNativePath) and non-content urls which were already working.

This solution works as far as I can tell.