CODEWITHSUNDEEP
cordovaionic-framework
amir baqdadi
amir baqdadi

Reputation: 174

how to download file in ionic and cordova with file transfer

i'm new in cordova and ionic

i want to download audio file from server

here is my code : 

$scope.DownloadFile = function(url,filename)
{

var ft = new FileTransfer();
ft.download(
  url + filename, // what u download
  "/sdcard/" + filename , // this is the filename as well complete url
  // fileSystem.root.toURL() +  filename ,  // use ios and others
  function(entry) {
    alert("success");
    alert(JSON.stringify(entry));

  },
  function(err) {
    alert(url + filename);
    alert(JSON.stringify(err));
  }
  );
}

my Variables ( url and filename ) works .

on my device return this error:

{"code":null,"source":null,"target":null,"http_status":null,"body":null,"exeption":null}

download link server:

http://sedaban.com/sedaban/users/json/app/mobile/download/145836602113212.mp3

Upvotes: 4

Views: 11994

Answers (2)

Gowtham
Gowtham

Reputation: 3233

Install ngCordova and cordova-plugin-file-transferplugin

Create a function something like this,

$scope.fileDownload = function() {
        var url = "http://www.podtrac.com/pts/redirect.mp3/traffic.libsyn.com/ariynbf/AR_052316_Travis_McElroy.mp3";
        var filename = url.split("/").pop();

        var targetPath = cordova.file.externalRootDirectory + filename;

        $cordovaFileTransfer.download(url, targetPath, {}, true).then(function(result) {
            //console.log('Success');
            $scope.hasil = 'Save file on ' + targetPath + ' success!';
            $scope.mywallpaper = targetPath;
            alert('Your download is completed');
        }, function(error) {
            //console.log('Error downloading file');
            $scope.hasil = 'Error downloading file...';
            alert('Your download is failed');
        }, function(progress) {
            console.log('progress');
            $scope.downloadProgress = (progress.loaded / progress.total) * 100;
            // var downcountString = $scope.downloadProgress.toFixed();
            // console.log('downcountString');
            // $scope.downloadCount = downcountString;
        });
    }

Don't forget to define $cordovaFileTransfer in your controller!

Then call the function in a click by doing something like this,

<button class="button button-small button-light" ng-click="fileDownload()"><i class="icon ion-android-download"></i> Download </button>

Note: Some devices may require you to enable storage permission for downloading purposes. I such cases, make sure "Storage" toggle button is turned on inside your app settings(settings> Application Settings > Permissions > Storage)

Upvotes: 2

liuwenzhuang
liuwenzhuang

Reputation: 966

First, ensure you have installed cordova-plugin-file-transfer plugin:

$ cordova plugin add cordova-plugin-file-transfer

And then ensure you download file after device has prepared:

$scope.DownloadFile = function (url, filename) {
   var ft = new FileTransfer();
   var source = encodeURI(url + filename);
   var targetPath = cordova.file.documentsDirectory + filename;//change path as you need
   var trustHosts = true;//optional
   var options = {};//optional
   ionic.Platform.ready(function () {//device prepared
     ft.download(source, targetPath, function (entry) {
       console.log('success' + JSON.stringify(entry));
     }, function (err) {
       console.log('failed' + JSON.stringify(err));
     }, trustHosts, options);
   });
}

About more information about cordova-plugin-file-transfer plugin, please refer to https://github.com/apache/cordova-plugin-file-transfer. Or if you want to use this plugin more comfortable, please try ngCordova and refer to http://ngcordova.com/docs/plugins/fileTransfer/. Hope this will help you, regards!

Upvotes: 0

Related Questions