使用Ionic 3将文件保存到Downloads目录

时间:2018-03-01 13:50:55

标签: android cordova ionic-framework ionic3

我知道这个链接:https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-file/#where-to-store-files

但我想将文件保存在Downloads目录中。这可以使用Ionic在任何路径中保存文件吗?如果是,请分享这个例子。

以下是代码:

downloadImage(image) {

this.platform.ready().then(() => {

  const fileTransfer: TransferObject = this.transfer.create();

  const imageLocation = `${cordova.file.applicationDirectory}www/assets/img/${image}`;

  fileTransfer.download(imageLocation, cordova.file.externalDataDirectory + image).then((entry) => {

    const alertSuccess = this.alertCtrl.create({
      title: `Download Succeeded!`,
      subTitle: `${image} was successfully downloaded to: ${entry.toURL()}`,
      buttons: ['Ok']
    });

    alertSuccess.present();

  }, (error) => {

    const alertFailure = this.alertCtrl.create({
      title: `Download Failed!`,
      subTitle: `${image} was not successfully downloaded. Error code: ${error.code}`,
      buttons: ['Ok']
    });

    alertFailure.present();

  });

});

}

基本上我想将文件保存在用户可见的位置。

6 个答案:

答案 0 :(得分:4)

要将文件下载到下载目录,您需要使用Cordova 文件 FileTransfer 插件。

import { File } from '@ionic-native/file';
import { FileTransfer } from '@ionic-native/file-transfer';

constructor(private transfer: FileTransfer) { }

fileTransfer: FileTransferObject = this.transfer.create();

//Use your File Url and name

downloadFile(file) {
  // Some Loading
  this.fileTransfer.download(url, this.file.externalRootDirectory + 
  '/Download/' + file).then(response => {
  console.log(response);
  this.dismissLoading();
  this.presentToast('File has been downloaded to the Downloads folder. View 
  it..')
  })
  .catch(err => {
    this.dismissLoading();
    console.log(err)
  });
}

希望有帮助。

答案 1 :(得分:3)

问题是缺乏许可。这是可以将文件下载到下载目录的工作代码:

async downloadFile() {
  await this.fileTransfer.download("https://cdn.pixabay.com/photo/2017/01/06/23/21/soap-bubble-1959327_960_720.jpg", this.file.externalRootDirectory + 
  '/Download/' + "soap-bubble-1959327_960_720.jpg");
}

getPermission() {
  this.androidPermissions.hasPermission(this.androidPermissions.PERMISSION.READ_EXTERNAL_STORAGE)
    .then(status => {
      if (status.hasPermission) {
        this.downloadFile();
      } 
      else {
        this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.READ_EXTERNAL_STORAGE)
          .then(status => {
            if(status.hasPermission) {
              this.downloadFile();
            }
          });
      }
    });
}

答案 2 :(得分:2)

import { File } from '@ionic-native/file';
import { FileTransfer } from '@ionic-native/file-transfer';
constructor(private file: File, private transfer: FileTransfer){}

let link = 'url_to_download_file';
let path = '';
let dir_name = 'Download'; // directory to download - you can also create new directory
let file_name = 'file.txt'; //any file name you like

const fileTransfer: FileTransferObject = this.transfer.create();
let result = this.file.createDir(this.file.externalRootDirectory, dir_name, true);
result.then((resp) => {
  path = resp.toURL();
  console.log(path);
  fileTransfer.download(link, path + file_name).then((entry) => {
    console.log('download complete: ' + entry.toURL());
  }, (error) => {
    console.log(error)
  });
}, (err) => {
  console.log('error on creating path : ' + err);
});

答案 3 :(得分:0)

此代码-离子3电容器-来自乔什·莫罗尼(Josh morony),从tmp目录拍摄一张照片,并使用FileSystem API将其写入此部分的Document目录中,以检索和处理路径

        Filesystem.writeFile({
            data: result.data,
            path: fileName,
            directory: FilesystemDirectory.Data
        })



getFromPhotos() {

  let options = {
  resultType: CameraResultType.Uri
  };

  Camera.getPhoto(options).then(

(photo) => {

    Filesystem.readFile({
        path: photo.path
    }).then((result) => {

        // let date = new Date(),
        // time = date.getTime(),
        time = 'bilder',
            fileName = time + '.jpeg';

        Filesystem.writeFile({
            data: result.data,
            path: fileName,
            directory: FilesystemDirectory.Data
        }).then((result) => {
            Filesystem.getUri({
                directory: FilesystemDirectory.Data,
                path: fileName
            }).then((result) => {
                console.log(result);
              let path = result.uri.replace('file://', '_capacitor_');
              this.image = this.sanitizer.bypassSecurityTrustResourceUrl(path);
            }, (err) => {
                console.log(err);
            });

        }, (err) => {
            console.log(err);
        });

    }, (err) => {
        console.log(err);
    });

}, (err) => {
    console.log(err);
}

);

}

在ionic 3中,您必须使用cordova File插件-请google。很容易理解:您定义了文件所在的原始目录,文件的原始名称,目标目录以及该函数中文件的新名称。原理是一样的。

答案 4 :(得分:0)

我知道这很晚,但是FileTransfer插件一直存在问题。也许就是我。相反,我通过File插件的writeFile()方法获得了成功。

我仍在使用iOS,但对于Android,这是我拥有的:

import { File } from "@ionic-native/file";

constructor(private fileSystem: File) {}

然后,无论您使用什么功能来保存文件,我们都有:

let path = this.fileSystem.externalRootDirectory + '/Download/'; // for Android
let filename = 'myNewFile.pdf';
this.fileSystem.writeFile(path, filename, File, { replace: true }).then(() => {
        this.toastCtrl.showToast('File has been downloaded. Please check your downloads folder.');
    }, (err) => {
        alert("Sorry. An error occurred downloading the file: " + err);
    }
);

正如我所说,我仍在寻找iOS可以使用的路径。而且我仍然想知道如何弹出通常在下载实际进入下载文件夹时出现的通知。但是至少我能够直接保存在Android的下载文件夹中。

答案 5 :(得分:0)

要将文件下载到下载目录,您需要使用 Cordova 文件插件:

import { File } from '@ionic-native/file/ngx';

constructor(
    private file: File,
  ) { }

this.file.writeFile(this.file.externalRootDirectory + '/Download/', user_log.xlsx, blob, { replace: true })
.then(() => {

              alert('File has been downloaded. Please check your downloads folder.')
    enter code here
            }, 
    (err) => {

              alert("Sorry. An error occurred downloading the file: " + err);
    enter code here
            });
          })

它也适用于 Ionic 4。