1 Reply Latest reply on May 9, 2016 9:24 AM by kerrishotts

    Error playing back video uploaded via PhoneGap FileTransfer

    vsocialVocanic

      I've been stuck on this issue for awhile and i can't seem to find a solution. What i am trying to achieve is this:

      1. Select a video from the phone's library
      2. Upload the video to Amazon AWS using a signed PUT url
      3. Download the uploaded video and play it back on the PC

      I am able to select the video from the phone's gallery and successfully upload it to Amazon aws. However, when i try to open and playback the file, media player says that the file format is not supported.

      It cannot be a codec issue with my player because i can playback other videos that were uploaded to amazon (via standard HTML file input). Plus, when i transfer the same video from my phone to the desktop, it is playable.

      I have a feeling that i'm missing out something when setting up the FileTransfer object. Below is a snippet of my code:

      navigator.camera.getPicture(
      function(imgUrl) {
        that
      .mDialogOpen("Uploading video...");
        window
      .resolveLocalFileSystemURL(imgUrl, function(fileEntry) {
            fileEntry
      .file(function(file) {
              
      var parts  = fileEntry.nativeURL.split('/');
              
      var filename  = parts[parts.length - 1];

             
      // Params is sent to the server to generate the signed amazon put url
              
      var params   = {'a':'handlerFunctionKey', 'name':filename, 'type':'multipart/encrypted'};

              
      var callback = function(data) {
                 alert
      ("In callback");
                
      var dataResp = data['handlerFunctionKey'];
                
      if (dataResp.status == 'SUCCESS') {
                    
      var amazonUrl = decodeURIComponent(dataResp.object);

                     alert
      ("Setting up options: " + file.type);
                    
      var ftOptions  = new FileUploadOptions();
                     ftOptions
      .fileName  = filename;
                     ftOptions
      .mimeType  = file.type;
                     ftOptions
      .chunkedMode  = false;
                     ftOptions
      .headers  = {'Content-Type':"multipart/encrypted",'x-amz-acl':'public-read',"Connection":"close"};
                     ftOptions
      .httpMethod  = 'PUT';

                    
      var ft = new FileTransfer();
                     ft
      .upload(imgUrl, amazonUrl,
                    
      function() {
                        $
      ("#mModalText").html("Upload success");
                    
      },
                    
      function(err) {
                        alert
      ("Upload error: " + err.code);
                        alert
      ("Upload target: " + err.target);
                        alert
      ("Upload source: " + err.source);
                    
      }, ftOptions, true);
                
      }
             
      };

             that
      .doAjax(params, callback); // Execute ajax call to server and run the callback function upon response
          
      }, function() {});
       
      }, function() {});
      },
      function() {}, options);

       

      The 'options' for the getPicture function are:

      var options = {quality:50, destinationType:Camera.DestinationType.FILE_URI};

      options['sourceType']   = Camera.PictureSourceType.PHOTOLIBRARY;

      options['mediaType']    = Camera.MediaType.VIDEO;

      options['targetWidth']  = 640;

      options['targetHeight'] = 480;

       

      The video i'm uploading is a MP4 with mimeType 'video/mp4'. I'm testing this on an Android. I'm building the code with Phonegap version 6.0.1 via remote build.

      Thanks in advance.