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软件包。否则，它要做的就是构造一个URL Params字符串，方法是使用=对键和值进行编码和连接，并使用&连接每对键对，如下所示：

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

邮递员工作，但fetch（）没有。为什么不？

1 个答案: