fetch API用application/javascript作Content-Type发POST请求返回异常

无法拿到预期返回是两处请求写法错误导致的：

• 请求体未做序列化：fetch的body参数不支持直接传入普通JavaScript对象，不显式处理的话，传入的对象会被默认转成字符串"[object Object]"，服务端根本解析不到title、body、userId这些自定义字段。
• Content-Type取值错误：application/javascript是标记内容为可执行JS脚本的MIME类型，jsonplaceholder服务端仅会对Content-Type为application/json的请求做JSON格式的请求体解析。传application/javascript时服务端不会解析请求内的业务字段，只会返回新生成的资源id，也就是你看到的{id: 101}。

按照服务端的解析规则调整请求配置即可：

• 用JSON.stringify()将待提交的JS对象序列化为JSON字符串，作为请求体传入
• 将请求头的Content-type修改为application/json; charset=UTF-8，明确告知服务端当前请求体是JSON格式，需要按JSON规则解析

修正后的可正常运行代码：

fetch('https://jsonplaceholder.typicode.com/posts', {
  method: 'POST',
  body: JSON.stringify({
    title: 'foo',
    body: 'bar',
    userId: 1,
  }),
  headers: {
    'Content-type': 'application/json; charset=UTF-8',
  },
})
  .then((response) => response.json())
  .then((json) => console.log(json));

执行上述代码即可得到预期返回：

{title: 'foo', body: 'bar', userId: 1, id: 101}

内容的提问来源于stack exchange，提问作者onepseudoxy