在 Javascript 中使用 Dropbox Core API 将文件上传到 Dropbox

Question

我正在开发一个简单的 chrome 扩展程序，它需要将文件上传到用户的保管箱文件夹。我正在使用下面提到的简单 AJAX 请求来上传文件，但是它适用于扩展名为 .txt, .json, .c, etc 的文件，即 mime type 类型为 text/plain 或类似的文件类型，但所有其他文件类型（如 pdf、图像文件等）都会损坏并产生空白内容。我在以正确的方式上传文件时错过了什么。

function startUpload()
{
    var folderPath = $(this).closest('tr').attr('path')+'/';
    var file = $("#upload_file")[0].files[0];
    if (!file){
        alert ("No file selected to upload.");
        return false;
    }

    var reader = new FileReader();
    reader.readAsText(file, "UTF-8");
    reader.onload = function (evt) {
        uploadFile(folderPath+file.name,evt.target.result,file.size,file.type);
    }
}

//function to upload file to folder
function uploadFile(filepath,data,contentLength,contentType){
    var url = "https://api-content.dropbox.com/1/files_put/auto"+filepath;
    var headers = {
        Authorization: 'Bearer ' + getAccessToken(),
        contentLength: contentLength,
    };
    var args = {
        url: url,
        headers: headers,
        crossDomain: true,
        crossOrigin: true,
        type: 'PUT',
        contentType: contentType,
        data : data,
        dataType: 'json',
        success: function(data)
        {
            getMetadata(filepath.substring(0,filepath.lastIndexOf('/')),createFolderViews);
        },
        error: function(jqXHR)
        {
            console.log(jqXHR);
        }
    };
    $.ajax(args);
}

Answer 1

我认为问题是 reader.readAsTextFile(file, "UTF-8")。如果文件不是文本文件，这将误解内容。我认为你想要reader.readAsBinaryString或reader.readAsArrayBuffer。（我自己没有测试过。）

编辑

自己测试后，我发现 readAsArrayBuffer 是你需要的，但你还需要将 processData: false 作为选项添加到 $.ajax 以防止 jQuery从尝试将数据转换为表单提交中的字段。

还要确保使用 dataType: 'json' 来正确解析来自服务器的响应。

在 Javascript 中使用 Dropbox Core API 将文件上传到 Dropbox

Upload files to Dropbox using a Dropbox Core API in Javascript

javascript

jquery

file-upload

dropbox

dropbox-api