File download in ionic capacitor app android 14

Issue: Permission Denied When Downloading Files in Ionic Capacitor App

Hi everyone,

I’m currently working on an Ionic Capacitor app and facing an issue when trying to download a file from external storage. Despite implementing the necessary permissions, I’m getting a “Permission Denied” error.

Here’s the method I’m using for downloading files:

import { AndroidPermissions } from '@ionic-native/android-permissions/ngx';
import { FileOpener } from '@awesome-cordova-plugins/file-opener/ngx';
import { File } from "@ionic-native/file/ngx";



async download(url) {
  this.requestWritePermission();
  const loading = await this.loadingCtrl.create({
    message: 'Downloading file...'
  });
  await loading.present();

  const filename = url.substring(url.lastIndexOf('/') + 1);
  const downloadFolder = this.platform.is('android') ? this.file.externalRootDirectory + 'download' : '';

  const request: DownloadRequest = {
    uri: url,
    title: filename,
    description: 'Downloading file...',
    mimeType: '',
    visibleInDownloadsUi: true,
    notificationVisibility: NotificationVisibility.VisibleNotifyCompleted,
    destinationUri: downloadFolder + '/' + filename,
  };

  this.downloader.download(request)
    .then((location: string) => this.presentToastDownload('File downloaded at: ' + location, location))
    .catch((error: any) => console.error(error));

  loading.dismiss();
}

requestWritePermission() {
  this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.MANAGE_EXTERNAL_STORAGE).then(
    (result) => {
      if (result.hasPermission) {
        // Permission granted
      } else {
        this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.MANAGE_EXTERNAL_STORAGE).then(
          (result) => {
            if (result.hasPermission) {
              // Permission granted
            } else {
              console.error('Write permission denied by the user.');
            }
          },
          (error) => {
            console.error('Error requesting write permission:', error);
          }
        );
      }
    },
    (error) => {
      console.error('Error checking write permission status:', error);
    }
  );
}
 async presentToastdownload(msg, location) {
    const toast = await this.toastController.create({
      message: "file downloaded",
      icon: 'checkmark-done',
      duration: 3000,
      cssClass: 'success_alert',
      buttons: [
        {
          text: 'Open',
          handler: () => {
            this.openfile(location);
          }
        }
      ]
    });
    toast.present();
  }
  openfile(path) {
    this.fileOpener.open(path, null)
      .then(() => {

      })
      .catch(e => {

      });
  }

Please update your post with proper code blocks so that we can easily read it.

Also, not sure what this.downloadFile is doing as I don’t see that function declared in the code you shared. Either way, looks like maybe you are trying to download files using the web stack? You should be downloading files at the native layer using the Capacitor plugin - Filesystem Capacitor Plugin API | Capacitor Documentation

Thank you for your suggestion! I’ve updated my post with proper code formatting for better readability.

1 Like

A couple of things. First, @ionic-native is dead - A New Chapter for @ionic-native - Ionic Blog.

Second, I believe you need to add file permissions to your AndroidManifest.xml. The plugins below mention what permissions are needed.

Since you are using Capacitor, I would use Capacitor plugins that are maintained instead of Cordova plugins.