How to display the downloaded images in gallery with ionic

好久不见. 提交于 2019-12-24 11:49:14

问题


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 fileTransfer: FileTransferObject = this.transfer.create();
let encoded_url = encodeURI(img_url);
fileTransfer.download(encoded_url, this.file.externalApplicationStorageDirectory+"download/"+img_id+".png", true).then((entry) => {
         // Download completed successfully
        let toast = this.toastCtrl.create({
          message: 'Image downloaded.',
          cssClass:'toastStyle',
          duration: 2000,
          position: 'bottom'
        });
        toast.present();
        // var cordova:any; with this line I got no errors but the downloaded image aren't available in the gallery
        cordova.plugins.MediaScannerPlugin.scanFile( this.file.externalApplicationStorageDirectory+"download/"+img_id+".png");

}, (error) => {
          // error was happened
          console.log("download error source "+  error.source);
          console.log("download error target " + error.target);
          console.log("upload error code" + error.code);
});

The error I got:

Uncaught (in promise): TypeError: Cannot read property 'plugins' of undefined TypeError: Cannot read property 'plugins' of undefined

Ionic version 4.6.0
Cordova version 9.0.0

Thanks.


回答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 download
        this.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)
  //OR
  this.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



来源:https://stackoverflow.com/questions/57354970/how-to-display-the-downloaded-images-in-gallery-with-ionic

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!