How to handle files using Cordova?

Note: this question is being re-posted because for whatever reason the original poster decided to remove it after an answer was provided and accepted. I am therefore adding it again to preserve the knowledge

Original question:

Im trying to used apache cordova api in an Hybrid application to save a file from a localhost:8080/filename.mp3 and download it into the app and open the file .mp3 locally in android.It's not working. Can i have any help please.

Here is the code:

main.js

 function wlCommonInit(){
//playAudio("http://audio.ibeat.org/content/p1rj1s/p1rj1s_-_rockGuitar.mp3");
}

         //!! Assumes filePath is a valid path on the device
      function DownloadAudio() {

    var fileTransfer = new FileTransfer();
       var uri = encodeURI("http://192.168.1.2:8080/tail_toddle.mp3");

    fileTransfer.download(
uri,
filePath,
function(entry) {
    console.log("download complete: " + entry.fullPath);
},
function(error) {
    console.log("download error source " + error.source);
    console.log("download error target " + error.target);
    console.log("upload error code" + error.code);
}
  );

     }

     // Audio player
  //
   var my_media = null;
   var mediaTimer = null;

    // Play audio
    //
     function playAudio(src) {
// Create Media object from src
my_media = new Media(src, onSuccess, onError);

// Play audio
my_media.play();

// Update my_media position every second
if (mediaTimer == null) {
    mediaTimer = setInterval(function() {
        // get my_media position
        my_media.getCurrentPosition(
            // success callback
            function(position) {
                if (position > -1) {
                    setAudioPosition((position) + " sec");
                }
            },
            // error callback
            function(e) {
                console.log("Error getting pos=" + e);
                setAudioPosition("Error: " + e);
            }
        );
    }, 1000);
}
          }

      // Pause audio
          //
     function pauseAudio() {
           if (my_media) {
             my_media.pause();
         }
    }

 // Stop audio
 //
function stopAudio() {
if (my_media) {
    my_media.stop();
`enter code here`  }
   clearInterval(mediaTimer);
    mediaTimer = null;
  }

  // onSuccess Callback
  //
   function onSuccess() {
    console.log("playAudio():Audio Success");
        }

  // onError Callback
//
 function onError(error) {
   alert('code: '    + error.code    + '\n' +
        'message: ' + error.message + '\n');
 }

// Set audio position
       //
      function setAudioPosition(position) {
   document.getElementById('audio_position').innerHTML = position;
      }

index.html

     <!DOCTYPE HTML>
   <html>
        <head>
        <meta charset="UTF-8">
        <title>index</title>
                 <meta name="viewport" content="width=device-width, initial-    scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
        <link rel="shortcut icon" href="images/favicon.png">
        <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
        <link rel="stylesheet" href="css/main.css">
        <script>window.$ = window.jQuery = WLJQ;</script>
    </head>
    <body style="display: none;">
        <!--application UI goes here-->
        Hello Worklight - Cordova Media API<br/><br/>

        <a href="#" class="btn large" onclick="DownloadAudio;">Download           Audio</a> - remote URL<br/>
        <a href="#" class="btn large" onclick="playAudio('/android_asset/www/default/audio/tail_toddle.mp3');">Play Audio</a> - local asset<br/>
        <a href="#" class="btn large" onclick="pauseAudio();">Pause Playing Audio</a><br/>
        <a href="#" class="btn large" onclick="stopAudio();">Stop Playing Audio</a><br/>
        <p id="audio_position"></p>
        <script src="js/initOptions.js"></script>
        <script src="js/main.js"></script>
        <script src="js/messages.js"></script>
    </body>

I added a new delete function:

index.html:

<a href="#" class="btn large" onclick="deleteAudio();">Delete the local MP3 file</a><br/>

main.js:

function deleteAudio() {
  var entry= "file:///data/data/com.TestApp/files/4638.mp3";
  function success(entry) {
    alert("Removal succeeded");
 }

  function fail(error) {
    alert('Error removing file: ' + error.code);
 }

// remove the file
entry.remove(success, fail);
}

why trying to delete, it is not deleting the code. i'm getting this error:

10-11 09:54:14.419: E/NONE(1821): Uncaught Exception: Uncaught TypeError: Object file:///data/data/com.TestApp/files/4638.mp3 has no method 'remove' at (compiled_code):68

Can i have any help?

The following code works for me.
Tested in MobileFirst Platform Foundation 7.1:

index.html

<button id="downloadMP3">Download MP3 file</button><br/>
<button id="playMP3" disabled>Play MP3 file</button>

main.js

var mediaFile;

function wlCommonInit(){
    $("#downloadMP3").click(downloadMP3);
    $("#playMP3").click(playMP3);
}

function downloadMP3() {
    var fileTransfer = new FileTransfer();
    var remoteFilePath = encodeURI("http://www.noiseaddicts.com/samples_1w72b820/4638.mp3");
    var localDownloadPath = cordova.file.dataDirectory + '4638.mp3';

    alert ("Downloading...");
    fileTransfer.download(
        remoteFilePath,
        localDownloadPath,
        function(successResponse) {
            mediaFile = successResponse.toURL();
            mediaFile = mediaFile.replace('file://','');
            $('#playMP3').prop('disabled', false);
        },
        function(errorResponse) {
            alert (JSON.stringify(errorResponse));
        }
    );
}

function playMP3() {
    var media = new Media(
        mediaFile,
        function() {
            alert("Playing audio file.");
        },
        function() {
            alert("Failed playing audio file.");
        }
    );

    media.play();
}

来源：https://stackoverflow.com/questions/33326618/how-to-handle-files-using-cordova

标签

cordova

ibm-mobilefirst