CODEWITHSUNDEEP
androidangularionic-frameworkurifilepath
Shinichi Kudo
Shinichi Kudo

Reputation: 344

Ionic FilePath not working, how to get the file path for Android 11

I've read about all the changes in the File system for Android, because of Android 11.

Here is my problem. I'm opening a file using Android File Chooser from Ionic. https://ionicframework.com/docs/native/file-chooser

 this.androidFileChooser
        .open({ mime: 'application/pdf' })
        .then((file) => {

This gives me this response : "content://com.android.providers.downloads.documents/document/11654".

The problem is that I need to get the real location of the file to convert it to base 64, and send it with a POST Request to the client server. So before all these problems, I was using Android File Path from Ionic : https://ionicframework.com/docs/native/file-path

this.filePath.resolveNativePath(file).then((filePath) => {

And I was receiving file:///storage/emulated/0/Download/pdffile.pdf Using this, I could transform it in base64 and everything worked well.

Now, it returns me nothing for Android 11. So All the process can't work if I don't have this filepath.

Do you have a solution for Angular/Ionic, to get the file Path for a file, for Android 11? This is very problematic.

Upvotes: 3

Views: 5776

Answers (3)

saif aly
saif aly

Reputation: 585

you need following plugin to install

  1. @ionic-native/file-path'
  2. @ionic-native/file-chooser

and it will give you

url: content://com.android.providers.downloads.documents/document/msf%3A29570

path: file:///storage/emulated/0/Download/flutter.pdf

      this.fileChooser
      .open()
      .then(url => {
        this.filePath.resolveNativePath(url)
          .then(filePath => {
                console.log('saif file pathhh',filePath);
          })
          .catch(err => console.log('saif file pathhh errorrr',err));
      })
      .catch(e => {
        console.log('saif file pathhh errorrr catchhh',e);
      });

Upvotes: 1

Shinichi Kudo
Shinichi Kudo

Reputation: 344

After some researches, it seems that Cordova doesn't target API 30 and the new changes in its scope. To solve my problem, I use Ionic Chooser, but using this one is problematic for the mimetype for Android (It allows to upload images from Google Drive when you set the mimetype to application/pdf). That's a loss for a win. I hope Cordova plugins maintainers will bring some solutions to these changes.

Upvotes: 1

Dave
Dave

Reputation: 5416

I use this in my Ionic 5 apps, tested on Android 11.

First I call getAsWebViewCorrectUrlMobile below in my app to get a reference to a local file, then I can convert that to base64 or whatever by getting its content.

      var url = this.getAsWebViewCorrectUrlMobile(inputFileUrl);
        
      this._http.get(url, { responseType: 'blob' }).toPromise().then(data => {
        resolve(data);
      }).catch(err => {
        if (err.status == 404) {
          alert('Could not find video file: ' + url);
        }
        resolve(null);
      });

File method:

import { Platform } from '@ionic/angular';

constructor(public _platform: Platform) {
    //...
}

getAsWebViewCorrectUrlMobile(fileUri: string) {
    if (this._platform.is('ios')) {
        return window.Ionic.WebView.convertFileSrc(fileUri);
    }
    else {
        // correct file paths on Android due to https://github.com/ionic-team/cordova-plugin-ionic-webview/issues/598
        var filePathCorrected = window.Ionic.WebView.convertFileSrc(fileUri);
        filePathCorrected = filePathCorrected.replace('file:/', "https://localhost/_app_file_/");
        return filePathCorrected;
    }
}

Upvotes: 0

Related Questions