将 FormData 发送到 ajax 时未捕获的 TypeError 非法调用答案

【问题标题】：Uncaught TypeError Illegal invocation when send FormData to ajax将 FormData 发送到 ajax 时未捕获的 TypeError 非法调用
【发布时间】：2016-03-19 09:50:29
【问题描述】：

我正在尝试将文件发送到服务器以进行一些处理。使用以下代码可以正常工作：

var formData = new FormData();
formData.append('file', $('#fileUpload')[0].files[0]);
options = JSON.stringify(options); // {"key": "value"}

$.ajax({
        url: "url",
        type: "POST",
        data: formData,
        processData: false,
        contentType: false,
        success: function (data) {

        },
        error: function (msg) {
            showMsg("error", msg.statusText + ". Press F12 for details");
            console.log(msg);
        }
    });

但是，我要做的不仅是发送 FormData，还要发送一个 json 对象。我正在尝试执行以下操作：

var formData = new FormData();
formData.append('file', $('#fileUpload')[0].files[0]);
options = JSON.stringify(options); // {"key": "value"}

$.ajax({
        url: "url",
        type: "POST",
        data: { "formData": formData, "options": options },
        //dataType: "json",
        //processData: false,
        //contentType: false,
        success: function (data) {

        },
        error: function (msg) {
            showMsg("error", msg.statusText + ". Press F12 for details");
            console.log(msg);
        }
    });

当我这样做时，我收到 Uncaught TypeError Illegal invocation 的错误消息根据我的研究，我找不到任何像这样发送表单数据的示例。这是否需要重组，是否有其他方法可以将 json 对象与表单数据一起发送？

【问题讨论】：

标签： javascript json ajax

【解决方案1】：

将 JSON 对象 options 附加到 FormData 有效。

var formData = new FormData();
formData.append('file', $('#fileUpload')[0].files[0]);
options = JSON.stringify(options);
formData.append('options', options); //append it with the form data and take it apart on the server

$.ajax({
    url: "url",
    type: "POST",
    data: formData,
    processData: false,
    contentType: false,
    success: function (data) {

    },
    error: function (msg) {
        showMsg("error", msg.statusText + ". Press F12 for details");
        console.log(msg);
    }
});

【讨论】：