为啥 `fetch` 将我的 JSON 字符串转换为查询字符串？副作用？ [复制]

Posted 2023-02-22

【中文标题】为啥 `fetch` 将我的 JSON 字符串转换为查询字符串？副作用？ [复制]

【英文标题】：Why `fetch` turned my JSON string to query string? Side effect? [duplicate]为什么 `fetch` 将我的 JSON 字符串转换为查询字符串？副作用？ [复制]

【发布时间】：2017-12-24 16:43:31

【问题描述】：

我整个下午都在经历这个，请帮我调试。

客户端：

fetch('/admin/edit/tags', 
    method: 'post',
    credentials: 'same-origin',
    headers: 
        'content-type': 'application/json',
        'accept': 'application/json'
    ,
    body: form.getFormData('json')
)...

console.log(form.getFormData('json')); 返回"id":"11","tag":"tag12","submit":"Update"

服务器端（Node.js）：

请求处理代码：

function (req, res) 
    var bufferBody = [];
    req.on('error', err => 
      return res.status(400).send('request error.');
    ).on('data', chunk => 
      bufferBody.push(chunk);
    ).on('end', () => 
      res.on('error', err => 
        return res.status(400).send('response error.');
      );
      req.bufferBody = bufferBody;
      req.stringBody = Buffer.concat(bufferBody).toString();
      //req.json = JSON.parse(req.stringBody);
      req.body = qs.parse(req.stringBody);
    )

路线：

    method: 'POST',
    path: '/admin/edit/tags',
    handle: PC(function*(req, res) 
        var data = req.body;
        console.log(data);
        console.log(req.stringBody);
    )

这是缓冲区字符串：theBuffer.toString() %7B%22id%22%3A%2211%22%2C%22tag%22%3A%22tag12%22%2C%22submit%22%3A%22Update%22%7D=

这是查询字符串：qs.parse(theBufferString) '"id":"11","tag":"tag12","submit":"Update"': ''

我检查了每一个地方，标题都是正确的。可能是什么原因导致 jsonString 变为 queryString？

我知道我可以将jsObject转为queryString，但我真的很想使用jsonString。

【问题讨论】：

不，该帖子特定于 jsfiddle。几小时前我就看过那个帖子了。

@AlexBlex 那篇文章是针对 jsfiddle 的，建议使用 query string 而不是 json string。但是fetch 不是应该可以与json string 一起使用吗？

它有一个非常有效的示例，说明如何使用 fetch 和 formdata 进行 POST。

你能发布 node.js 的代码来处理请求吗？

@ŁukaszSzewczak 我已经添加了请求的代码，请看一下。

【参考方案1】：

我发现了问题所在。它在服务器端。

我编写了自己的请求客户端，并在客户端中将任何req.body 转换为query string。因为之前我只是按照示例：https://nodejs.org/api/http.html（滚动到末尾）在 Node.js 文档中。所以我添加了req.headers['content-type']检查，如果josn，使用JSON.stringify，否则使用qs.stringify。

if (options.body) //solve socket hangup problem
    if (isJSON()) 
    // TODO add more content-type, not just json
    //e.g for forms: application/x-www-form-urlencoded
        options.body = JSON.stringify(options.body);
       else 
        options.body = qs.stringify(options.body);
    
    options.headers['content-length'] = Buffer.byteLength(options.body);