从浏览器使用Dropbox v2 API

Question

我正在尝试通过webbrowser（FF 42.0，PhantomJS 1.9.8）和Dropbox v2 API将数据上传到Dropbox。 我的功能看起来像这样

function(path, data, callback) {
        $.ajax({
            url: 'https://content.dropboxapi.com/2/files/upload',
            type: 'post',
            contentType: 'application/octet-stream',
            beforeSend: function(jqXHR) {
                jqXHR.setRequestHeader("Content-Type","application/octet-stream");
            },
            data: data,
            headers: {
                "Authorization": "Bearer " + token,
                "Dropbox-API-Arg": '{"path": "' + path + ',"mode": "add","autorename": true,"mute": false}',
                "Content-Type": "application/octet-stream"
            },
            success: function (data) {
                callback(data);
            }
        });
    }

甚至我在我能想到的所有属性上都设置了Content-Type到application/octet-stream我得到以下错误

Error in call to API function "files/upload": Bad HTTP "Content-Type" header: "application/octet-stream
; charset=UTF-8".  Expecting one of "application/octet-stream", "text/plain; charset=dropbox-cors-hack"

看一下Firebug中的请求，我发现Content-Type确实设置为application/octet-stream; charset=UTF-8 application/octet-stream; charset=UTF-8 。 尝试text/plain; charset=dropbox-cors-hack text/plain; charset=dropbox-cors-hack作为Content-Type，发送的请求具有text/plain; charset=UTF-8 text/plain; charset=UTF-8 ，我得到同样的错误消息。

我该如何使jquery和我的浏览器设置所需的标题。

编辑：Chrome IE中的相同行为按预期工作

Answer 1

从技术上讲，Firefox只是遵守W3C XMLHttpRequest规范：

http://www.w3.org/TR/XMLHttpRequest/#the-send()-method

发送Blob或ArrayBufferView之外的任何内容都可能导致浏览器尝试以UTF-8编码数据（遵循规范）时出现问题。

正确的做法是避免将数据作为字符串发送。 下面是两个如何避免此行为的示例：

// ... file selected from a file <input>
file = event.target.files[0];
$.ajax({
    url: 'https://content.dropboxapi.com/2/files/upload',
    type: 'post',
    data: file,
    processData: false,
    contentType: 'application/octet-stream',
    headers: {
        "Authorization": "Bearer " + ACCESS_TOKEN,
        "Dropbox-API-Arg": '{"path": "/test_ff_upload.txt","mode": "add","autorename": true,"mute": false}'
    },
    success: function (data) {
        console.log(data);
    }
})

或者，如果您要发送文本，则可以在上传自己之前对文本进行UTF-8编码。 一种现代的方法是使用TextEncoder ：

var data = new TextEncoder("utf-8").encode("Test");
$.ajax({
    url: 'https://content.dropboxapi.com/2/files/upload',
    type: 'post',
    data: data,
    processData: false,
    contentType: 'application/octet-stream',
    headers: {
        "Authorization": "Bearer " + ACCESS_TOKEN,
        "Dropbox-API-Arg": '{"path": "/test_ff_upload.txt","mode": "add","autorename": true,"mute": false}'
    },
    success: function (data) {
        console.log(data);
    }
})

Answer 2

尝试这个...

     private void upload(object sender, EventArgs e)
     {

         OAuthUtility.PutAsync
             (
               "https://content.dropboxapi.com/1/files_put/auto/",
               new HttpParameterCollection
               {
                  {"access_token",Properties.Settings.Default.AccessToken},
                  { "path", Path.Combine(this.CurrentPath, Path.GetFileName(openFileDialog1.FileName)).Replace("\\", "/") },
                  { "overwrite","false"},
                  { "autorename","false"},
                  {openFileDialog1.OpenFile()}     
               },

               callback : Upload_Result
             );
     }