如何将给定的 curl 命令复制为 jquery ajax 请求？答案

【问题标题】：How can I duplicate the given curl command as a jquery ajax request?如何将给定的 curl 命令复制为 jquery ajax 请求？
【发布时间】：2016-05-16 23:59:51
【问题描述】：

我有以下 REST API 调用示例 -

curl -u "{username}":"{password}" -X POST \
-F "images_file=@test.jpg" \
"https://gateway.watsonplatform.net/visual-recognition-beta/api/v2/classify?version=2015-12-02"

我想将上述调用作为标准 ajax 请求执行。这就是我目前所拥有的 -

cropper.getCroppedCanvas().toBlob(function(blob){
        var uploadData = new FormData();
        uploadData.append('images_file',blob);

        $.ajax('https://gateway.watsonplatform.net/visual-recognition-beta/api/v2/classify?version=2015-12-02', {
        method: "POST",
        data: uploadData,
        processData: false,
        contentType: false,
        beforeSend: function (xhr) {
            xhr.setRequestHeader('Authorization', 'Basic ODdlOTTZIeg==');
        },
        success: function (data) {
            console.log('Upload success');
            console.log(data);
        },
        error: function (data) {
            console.log('Upload error');
            console.log(data);
        }

    })

    })

我得到一个错误 -

"{"code":400,"error":"Could not classify. Verify that valid images were uploaded."}"

我的预感是 cURL 的 -F image_results=@test.jpg 在上面的 ajax 调用中没有被正确模拟。

cropper.getCroppedCanvas() 是来自cropperjs 库的函数调用。

【问题讨论】：

标签： javascript jquery ajax curl

【解决方案1】：

像这样使用formData 和blob：

formdata.append("myfile", myBlob, "filename.txt");

见Document

使用 append() 方法时，可以使用第三个可选参数在发送到服务器的 Content-Disposition 标头中传递文件名。当未指定文件名（或不支持该参数）时，使用名称“blob”。

所以，对于你的情况：

cropper.getCroppedCanvas().toBlob(function(blob){

    var uploadData = new FormData();

    var filename = "your-file-name-with-suffix";
    uploadData.append('images_file',blob,filename);

    //$.ajax(...);
});

【讨论】：