Downloading files in Ionic using cordova-plugin-file-transfer

Try logging the pdfLocation and targetPath just above the download call, also you could create an extra folder to avoid polluting the www folder, though the last part shouldn’t be an issue.

Installing the older version and changing a few require names now have the success function firing!

Thanks for all the help, luchillo17!

Try filling a issue so that this get fixed soon, if you don’t it won’t get fixed and more people will fall in unknown error hell.

Hello !
I’m new to ionic2 and I’ve got a problem loading the plugin, maybe you can help me ?
When I do this :

  upload() {
    this.platform.ready().then(() => {
        // Upload the file
        this.ft = new FileTransfer();

I’ve got an error like this :
Unhandled Promise rejection: FileTransfer is not defined ; Zone: angular ; Task: Promise.then ; Value:
ReferenceError: FileTransfer is not defined

Of I’ve added the plugin with “ionic plugin add cordova-plugin-file-transfer” but I think I missed something else…

I’m running ionic 2.0.0-beta.4, thanks for your help.

I created a simple example here: https://github.com/dsgriffin/Ionic-2-File-Transfer-Example, hope it helps

3 Likes

thanks a lot dsgriffin ! but it’s seems “webpack.config.js” is missing so I can’t build your app.

Oh - I think Ionic have removed Webpack from Ionic 2 in favour of Browersify. I updated to beta.4 and did the standard ‘ionic new … --ts’ initialisation to create the project.

hi!@dsgriffin!
I have a question,I’m copying your project(GitHub - dsgriffin/ionic-3-file-transfer-example: 📁 File Transfer in Ionic 3 using Ionic Native's File and Transfer modules),but

EXCEPTION: Uncaught (in promise): ReferenceError: FileTransfer is not defined
I don’t have the answer,it used ionic2+angularjs2.
Thank for your help!

hi @pengzong,

I have made a huge update to the project recently, make sure you’ve got the latest version!

I am now using Ionic Native with it, so to install it’s (so ionic plugin add cordova-plugin-file-transfer to install and const fileTransfer = new Transfer(); to use rather than new FileTransfer which I think you have?)

If you are still having problems after this, feel free to open an issue on Github with more details here: https://github.com/dsgriffin/ionic-2-file-transfer-example/issues

Thanks

1 Like

This is my code.I run in the Simulator,
> import { Transfer } from ‘ionic-native’;
> …
> export class ProductDownPage {
> constructor(public navCtrl: NavController, public params: NavParams, public http: Http, public toastCtrl: ToastController, public platform: Platform) {
> this.DownFile();
> }
> DownFile() {
> var image = “http://www.desktopwallpaperhd.net/thumbs/8/7/xiaogoukuanping-animal-tupian-85399.jpg”;
> this.platform.ready().then(() => {
> const fileTransfer = new Transfer();
> alert(JSON.stringify(fileTransfer));//alert:{"_objectInstance":{"_id":13,“onprogress”:null}}
> const imageLocation = $Download/1.jpg;
> alert(JSON.stringify(imageLocation));//alert:$Download/1.jpg
> fileTransfer.download(imageLocation, image).then((entry) => {
> let toast = this.toastCtrl.create({
> message: ‘文件下载成功!’,
> duration: 3000
> });
> toast.present();
> }, (error) => {
> //error:[Object,Object]
> let toast = this.toastCtrl.create({
> message: error,
> duration: 3000
> });
> toast.present();
> });
>
> });
> }
> }
Thank you very much!

@pengzong I do not think it will work on a simulator - please try it on a device and post the error log.

Btw the first argument should be the image location, the second the target location. See here for example of which directory to save to: https://github.com/dsgriffin/ionic-2-file-transfer-example/blob/master/src/pages/home/home.ts

Thanks!It`s worked!My file location is wrong.

1 Like

This is my code;
downloadImage(image) {

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

  const fileTransfer = new Transfer();
  const imageLocation = `${cordova.file.applicationDirectory}www/assets/img/${image}`;
  // console.log(imageLocation,this.storageDirectory + image);
  fileTransfer.download(imageLocation, this.storageDirectory + image).then((entry) => {
    const alertSuccess = this.alertCtrl.create({
      title: `Download Succeeded!`,
      subTitle: `${image} was successfully downloaded to: ${entry.toNativeURL()}`,
      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();

  });

});

}
I referred from git hub. it showing success message but file is missing in destination folder.
I think there is an error in download. plz help…

I have an requirement to cancel the download if i click cancel icon its possible to do that anyone help me.
I already started the download for 3 files if i want to cancel the second file download means how to do that help me
Thanks…

console.dir({"key": "value"})

I have a question to Your project. It saves file in then application folder but I would like to save it in Downloads folder. Im struggling with this a lot, I even got feeling that it is not possible to do it via Ionic. It seems I cannot access anything outside of the application folder. Would You like to tell me how to achieve that?

There are some examples on StackOverflow that should help:

Thank for the answer but i still could not resolve this issue. Particularly I have problem with using “window.requestFileSystem()”. I don’t inderstand how to use it, visual studio code shows that window has no method like this.
I described my problem here https://stackoverflow.com/questions/49444991/ionic-3-download-a-file-to-directory

Hi, I was able to download the file successfully in Ionic iOS. The file path after the successful download is like this.

file:///var/mobile/Containers/Data/Application/2F62D40C-2C61-4E4C-B51A-9B5217F4FD84/Documents/NF4016-130116.jpg

The above file is an image, but I’m not getting where this file is physically present on my iPhone 6s. I checked in photos app but it is not there. Any help would be appreciated.