Beschädigte Dateien beim Hochladen auf Dropbox über Ajax

Question

Ich versuche, die Dropbox-API zu verwenden, um Dateien über eine Webschnittstelle mit Ajax an einen bestimmten Dropbox-Ordner zu senden.

Hier ist mein Code:

function UploadFile(token, callback) { 

    var fileName  = $('input[type=file]')[0].files[0].name, 
     fileData  = new FormData($('#file-upload')[0]), 
     dbxHeaderParams = { 
      'path': '/' + fileName, 
      'mode': { '.tag': 'add' }, 
      'autorename': true 
     }; 

    $.ajax({ 
     url: 'https://content.dropboxapi.com/2/files/upload', 
     type: 'POST', 
     headers: { 
      'Authorization': 'Bearer ' + token, 
      'Content-Type': 'application/octet-stream', 
      'Dropbox-API-Arg': JSON.stringify(dbxHeaderParams) 
     }, 
     data: fileData, 
     processData: false, 
     contentType: false, 
     success: function(result) { 
      console.log('NICE BRO'); 
      callback(); 
     }, 
     error: function(error) { 
      console.error(error); 
      callback(); 
     } 
    }); 

} 

Dieser Code funktioniert: Dateien werden hochgeladen auf meine Dropbox-Ordner, und ich kann sie öffnen. Sie haben sogar den richtigen Namen und (fast) die richtige Größe. Aber das Problem ist, dass sie alle beschädigt sind, weil einige Zeilen während des Prozesses hinzugefügt werden. Hier

ein Beispiel: auf meine Dropbox

harder better faster stronger 

Einmal hochgeladen, es sieht wie folgt aus: Wenn ich eine .txt Datei enthält diese hochladen möchten

-----------------------------2308927457834 
Content-Disposition: form-data; name="file"; filename="test.txt" 
Content-Type: text/plain 

harder better faster stronger 
-----------------------------2308927457834-- 

Ich nehme an, dies ist Warum kann ich Dateien wie Bilder nicht öffnen. Ich habe mehrere Lösungen ausprobiert, aber keine von ihnen kann das lösen. Was mache ich falsch ? Vielen Dank !

Answer 1

Es wäre nützlich, die relevanten Teile des HTML zu sehen, aber es sieht so aus, als ob Sie das Objekt FormData für den Upload-Aufruf bereitstellen, im Gegensatz zu File.

Versuchen Sie, diese Linie zu ersetzen:

 fileData  = new FormData($('#file-upload')[0]), 

mit diesem:

 fileData  = $('input[type=file]')[0].files[0],