在我的ReactApp中使用FakeJSON会返回"Error - missing token"

Question

是否有人使用app.fakejson.com网站为其应用程序获取示例数据？

我正在创建一个帖子请求，正如在他们的网站上所说的，但它返回了一个错误"；错误-令牌丢失"；，尽管令牌在POST中处于数据有效载荷内。

const fetch2body = JSON.stringify({
token: '<mytokeninhere>',
data: {
name: 'name',
numberInt: 'numberInt',
dateTime: "dateTime|UNIX",
stringLong: "stringLong",
fileName: 'fileName',
fileExtension: 'fileExtension',
productOrderStatus: 'productOrderStatus',
_repeat: 25
}
});
try {
const datafetch2 = await fetch(
'https://app.fakejson.com/q',
{
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
data: fetch2body });
const actualdata2 = await datafetch2.json();
console.log(actualdata2);
catch(e) {
console.log(e);
}

Answer 1

字符串化响应没有错(MDN示例(。

代码的问题在于您使用了错误的参数来发送数据。将data更改为body。

取而代之的是：

const datafetch2 = await fetch(
'https://app.fakejson.com/q',
{
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
// data is not a valid parameter
data: fetch2body
}
);

您应该使用body参数，如下所示：

const datafetch2 = await fetch(
'https://app.fakejson.com/q',
{
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
// body is the correct parameter
body: fetch2body
}
);

你可以在Mozillafetch文档上阅读更多关于它的信息

Answer 2

您正在stringify处理json对象并将其发送到端点。只需发送纯json对象，它应该是可以的(考虑到所有其他字段/验证都可以(

const fetch2body = {
token: '<mytokeninhere>',
data: {
name: 'name',
numberInt: 'numberInt',
dateTime: "dateTime|UNIX",
stringLong: "stringLong",
fileName: 'fileName',
fileExtension: 'fileExtension',
productOrderStatus: 'productOrderStatus',
_repeat: 25
}
};