邮差工作,但fetch()没有.为什么不？

Question

邮差请求似乎工作,但我不能让fetch()使用相同的请求和标头.它让我疯狂.

客户:

fetch('http://localhost:1234/acts/create', {
    method: 'POST',
    headers: {
        "Content-Type": "application/x-www-form-urlencoded",
    },
    body: JSON.stringify({
        name: 'BARNEY MCGREW!',
        rating: 90,
    })
})

表达:

exports.act_create = function (req, res) {
    console.log(' req >>>>', req.body);
    var act = new Act(
        {
            name: req.body.name,
            rating: req.body.rating
        }
    );

    // res.set('Content-Type', 'application/x-www-form-urlencoded');

    act.save(function (err) {
        if (err) {
            return console.log(err);
        }
        res.send('Act Created successfully')
    })
};

这会生成以下终端输出:

 req >>>> :  [Object: null prototype] { '{"name":"IngleburtHumperdink","rating":10}': '' }
act is:  { _id: 5c4245bea7bb511c20de6b7a }

所以它有点过来,但后来我得到了ValidationError: Act validation failed: name: Path名字is required., rating: Path "rating" is required.

路径"名称"相同.

因此,很难将json字符串化对象与名称/评级值匹配.但是从POST请求的正文中删除JSON.stringify会让我感到困惑. req >>>> [Object: null prototype] { '[object Object]': '' }

我在这做错了什么？

[是否有任何好的博客,他们清楚地解释如何通过正文传递数据,以便可以fetch()无问题地访问？]

Answer 1

该x-www-form-urlencoded请求主体必须是name=BARNEY%20MCGREW%21&rating=90.

您通过fetch身体发送请求'{"name":"BARNEY MCGREW!","rating":90}'.

由于没有=,因此整个JSON字符串被视为具有空值的参数名称.

因此,您将从req.body字符串化JSON作为键出现的位置获得一个对象.

创建URLSearchParams你的数据传递给构造-取代JSON.stringify.

fetch('http://localhost:1234/acts/create', {
    method: 'POST',
    headers: {
        "Content-Type": "application/x-www-form-urlencoded",
    },
    body: new URLSearchParams({
        name: 'BARNEY MCGREW!',
        rating: 90,
    })
})

你的fetch请求机构现在应该是name=BARNEY%20MCGREW%21&rating=90.

这将由正文解析器正确解析为x-www-form-urlencoded内容.

如果URLSearchParams未定义,则会有npm包提供它.否则,它所做的只是通过编码并使用a连接键和值来构造URL Params字符串=,并将每个对与a 连接&,这可以这样做:

function URLSearchParams(data) {
    return Object.keys(data).map(key => {
        return `${encodeURIComponent(key)}=${encodeURIComponent(data[key])}`;
    }).join('&');
}