downloading file with binary data. Not receiving entire contents of file.

Question

javascript, running in the browser.

using XMLHttpRequest and the content.dropboxapi.com/2/files/download endpoint to download a zip file from my dropbox folder.  I am receiving the file. But the last 100 or so bytes are missing.  Why am I not receiving the entire contents of the file?

I get the size of the file from the list_folder API. That number is a little bit larger than the length of the xhr.response property.  And when I pass xhr.response to a function that treats the response data as a zip file stream, the error says the file cannot be unzipped.  The error says missing ****** number of bytes. That number matches the number of bytes that are missing from the download.

thanks,

// ---------------------- dropbox_GetFile_http ------------------------           
function dropbox_GetFile_http( path, token )                                      
{                                                                                 
  var xhr = new XMLHttpRequest( ) ;                                              
  xhr.onreadystatechange = function( )                                           
  {                                                                               
    if ( xhr.readyState == XMLHttpRequest.DONE)                                  
    {                                                                             
      if (xhr.status == 200)                                                     
      {                                                                           
        var lx   = xhr.response.length ;                                         
        console.log( 'got data. ' + 'lgth:' + lx ) ;                              
        unzip( xhr.response ) ;                                                  
      } else                                                                      
      {                                                                           
        var msg = 'status:' + xhr.status ;                                       
        console.log( msg ) ;                                                      
      }                                                                           
    }                                                                             
  } ;

var runAsync = true ; 
  xhr.open('POST', 'https://content.dropboxapi.com/2/files/download', runAsync);
  xhr.setRequestHeader('Authorization', 'Bearer ' + token );                    
  xhr.setRequestHeader('Dropbox-API-Arg', JSON.stringify({ path: path })) ;     
  xhr.send();
}

steve_lae0901 · Accepted Answer

I was not setting the responseType of the xhr object to 'arraybuffer'.  Once I did that the download worked.

// ---------------------- dropbox_GetFile_http ------------------------           
function dropbox_GetFile_http( path, token )                                      
{                                                                                 
  var xhr = new XMLHttpRequest( ) ;                                              
  xhr.onreadystatechange = function( )                                           
  {                                                                               
    if ( xhr.readyState == XMLHttpRequest.DONE)                                  
    {                                                                             
      if (xhr.status == 200)                                                     
      {                                                                           
        var lx   = xhr.response.byteLength ;                                         
        console.log( 'got data. ' + 'lgth:' + lx ) ;                              
        unzip( xhr.response ) ;                                                  
      } else                                                                      
      {                                                                           
        var msg = 'status:' + xhr.status ;                                       
        console.log( msg ) ;                                                      
      }                                                                           
    }                                                                             
  } ;

var runAsync = true ; 
  xhr.open('POST', 'https://content.dropboxapi.com/2/files/download', runAsync);
xhr.responseType = 'arraybuffer' ;
  xhr.setRequestHeader('Authorization', 'Bearer ' + token );                    
  xhr.setRequestHeader('Dropbox-API-Arg', JSON.stringify({ path: path })) ;     
  xhr.send();
}