有人知道如何发送这种数据格式吗?

image.png

咱们正常传multi-part form-data,都是这种格式的 Documents[0][documentTitle],不过我们公司后端做的这个API,接受的是格式是中间多了一个点,也就变成了 Documents[0].documentTitle, 我正常发的json对象,后端说接收不到。让我改成他的这种格式,我不太知道怎么改,希望大佬能够指点,怎么想才能生成出这种带着dot(.)的格式阿?

附带一张我正常的payloadimage.png

这是后端的代码image.png

阅读 2.7k
3 个回答

偷偷告诉你,其实可以抄postman的代码
image.png

// WARNING: For POST requests, body is set to null by browsers.
var data = new FormData();
data.append("Documents[0][documentTitle]", "title1");

var xhr = new XMLHttpRequest();
xhr.withCredentials = true;

xhr.addEventListener("readystatechange", function() {
  if(this.readyState === 4) {
    console.log(this.responseText);
  }
});

xhr.open("POST", "https://www.baidu.com");

xhr.send(data);

笨方法就是手动一项一项拼接呗,然后挨个往 FormData 对象里 append。


如果你是想传入一个 object 后能自动序列化成这样的格式,可以自定义一个序列化器。

假设你用的是 axios,axios 有一个 formSerializer 配置项,你可以通过它来自定义序列化方式。具体代码我就不写了,反正是开源的,你可以照着默认的序列化器改一改,拼接复杂对象属性的时候把“点”加上。


至于你的后端,目测是 ASP.NET Core。框架自带的 [FromForm] 这种模型绑定方式确实是需要嵌套对象的属性之间是带“点”的。不过让后端自定义一个 ModelBinder 倒是也能实现,就看你们这个最后是前端改还是后端改了。


其实本质就是 FormData 这玩意儿设计出来的时候压根就没考虑这种复杂的嵌套对象该怎么传输的问题,它就是个简单的 Key-Value 结构的。但现实中总会有复杂对象需要传输,于是乎各个语言或框架会自己想办法搞一套序列化方案,但彼此未必兼容,也没个统一的国际标准。同构开发时挺好的;一旦异构开发,两边儿序列化方式不同就产生这种问题了,只能是有一方妥协了。

按照指定格式手动构造一下 FormData 就好,示例如下:

const documents = [{
  title: "Hello 1",
  file: "file1"
}, {
  title: "Hello 2",
  file: "file2"
}];

const form = new FormData();

for (const [index, { title, file }] of Object.entries(documents)) {
  form.append(`documents[${index}].title`, title);
  form.append(`documents[${index}].file`, file);
}

axios.post("/", form);
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏