How To Display The Downloaded Images In Gallery With Ionic

I Try to make an image available in the gallery after downloading, I use MediaScannerPlugin , so the question is how I can access cordova's plugin ? this is my code: const fileTran

Solution 1:

downloadViaURL(url){
    let url = "https://download.com/file.whatever";
    let path = this.file.externalDataDirectory + url.substring(url.lastIndexOf('/') + 1);

    this.file.checkFile(this.file.externalDataDirectory,url.substring(url.lastIndexOf('/') + 1)).then(value => {
      console.log('is already downloaded');
    },reason => {

      console.log('reason : ',JSON.stringify(reason))
      this.fileTransferObject = this.fileTransfer.create();

      this.fileTransferObject.download(url,path,true).then(value => {

        console.log('download : ',JSON.stringify(value));
        this.moveToGallery(value)


      },rejected=>{
        console.log('download rejected : ',JSON.stringify(rejected));
//incomplete file downloadthis.file.removeFile(this.file.externalDataDirectory,url.substring(url.lastIndexOf('/') + 1)).then(value => {
          console.log('removeFile : ',JSON.stringify(value))
        },reason =>{
          console.log('removeFile reason : ',JSON.stringify(reason))

        }).catch(error=>{
          console.log('removeFile error : ',JSON.stringify(error))
        })


      }).catch(err=>{
        console.log('download error : ',JSON.stringify(err));
      })

//now the file(img/video/..) is download in project(com.app)/file which temp folder i.e. this.file.externalDataDirectory where it takes. this folder will be deleted where you delete the app that why you have to move or copy the file.

moveToGallery(value){
  this.file.moveFile(path, fileName, newPath, newFileName)
  //ORthis.file.copyFile(path, fileName, newPath, newFileName)
}

Additional If you want to use save file which is in mobile storage then https://stackoverflow.com/a/57494421/7456041

Solution 2:

Just declare a variable on top of the page. At runtime, it will find the appropriate plugins and will send requests. Below you can find simple demonstration.

import { Injectable } from'@angular/core';
import {ToastController, LoadingController, Events, Toast, NavController, Platform} from'ionic-angular';

declarevarMediaScannerPlugin: any;

@Injectable()
exportclassYourClass {
     ...
     MediaScannerPlugin.scanFile( this.file.externalApplicationStorageDirectory+"download/"+img_id+".png");
     ...
}