Known issues updated. Learn more

Dropbox does not decode the file properly after uploading from XHR in javascript

New member | Level 2


I followed the link- to upload a file. After it is uploaded, content is corrupted or giving [object Object]

here is my code -

var file = event.getParam("files");
        var xhr = new XMLHttpRequest();
        var dropboxToken='accessToken';
        xhr.upload.onprogress = function(evt) {
            var percentComplete = parseInt(100.0 * evt.loaded /;
            // Upload in progress. Do something here with the percent complete.
            console.log('completed percentage=  '+percentComplete);
        xhr.onload = function() {
            if (xhr.status === 200) {
                var fileInfo = JSON.parse(xhr.response);
                // Upload succeeded. Do something here with the file info.
                console.log('fileinfo after successful upload--'+JSON.stringify(fileInfo));
            else {
                var errorMessage = xhr.response || 'Unable to upload file';
                // Upload failed. Do something here with the error.
       'POST', '');
        xhr.setRequestHeader('Authorization', 'Bearer ' + dropboxToken);
        xhr.setRequestHeader('Content-Type', 'application/octet-stream');
        xhr.setRequestHeader('Dropbox-API-Arg', JSON.stringify({
            path: '/' +  file[0].name,
            mode: 'add',
            autorename: true,
            mute: false
1 Reply

Re: Dropbox does not decode the file properly after uploading from XHR in javascript


The code from that blog post expects `file` to be a JavaScript `File` object.

I'm not sure what the `event.getParam` does in your version of the code, but it appears it's not retrieving the actual `File` object, and so is instead just uploading the string representation "[object Object]" of whatever object it is returning.

You should instead make sure `file` is a `File` object. For example, that might look like this, if listening to the onchange event for a file input with the id "fileInput":


var fileInput = document.getElementById('fileInput')
var file = fileInput.files[0];



Developer & API Discussions

Have a question? Our Dropbox Community is here to help you find an answer!
You won’t have to wait too long for a reply, but why not learn more about the Community while you’re here.

Not the right discussion for you? Find out what else our Community has to say about Developer & API Discussions.

Or, search our Help Center for even more.

Who's talking
Top contributors to this post