如何创建 XMLHttpRequest FormData 表单对象

How to create a XMLHttpRequest FormData form object

本文关键字:XMLHttpRequest FormData 表单 单对象 创建 何创建      更新时间:2023-09-26

我有一个包含文件的表单,所以我使用 XMLHttpRequest 来处理数据的发送。

我正在尝试做的是能够发送将由杰克逊在服务器端解析的对象。 就像你对 JSON 所做的那样。

例如:

{
"number": 123,
"string": "Hello World",
"object": {
    "a": "b"
}

}

所以我想创建"对象"。 据我所知,我只能用"数字"和"字符串"做

 formData.append("string", "Hello World");

也许有办法格式化它?

当我只是附加一些 JSON 格式的对象时,我得到的结果是:

    var oData = new FormData(document.forms.namedItem("upload-form"));
     element= {};
     element.id = 2;
     element.type = "dfsdf";
     element.url = "sdfsdff";
     element.version = "asdasd";
     arrayOfelement[0] = framework;
     oData.append("file", this.myfile.getFile());
     oData.append("frameworks",JSON.stringify(arrayOfelement))
     var xhr = new XMLHttpRequest();
     xhr.open('POST', 'design', true);   
     xhr.onload = function(e) { 
        console.log("upload finished");
      };
     console.debug("sending form data", oData);
     xhr.send(oData);


------WebKitFormBoundaryVWNBucDMZSIlUcXY

Content-Disposition: form-data; name="arrayOfElements" {"0":{"id":2,"type":"dfsdf","url":"sdfsdff","version":"asdasd"}}

这显然不会在服务器端解析为任何内容。

要使用XMLHttpRequest通过表单数据发送Javascript对象,您需要将其字符串化:

var obj = {
    "number": 123,
    "string": "Hello World",
    "object": {
        "a": "b"
    }
}
formData.append(JSON.stringify(obj));

更多内容: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify