javascript - 使用 fetch 时请求正文为空

Question

我正在尝试使用 fetch 从 React 组件向 PHP 服务器进行 graphql 调用。这是我第一次尝试使用 fetch。

我在浏览器端使用 React JS，在服务器端使用 Symfony 4。然而，即使我的浏览器开发工具似乎表明数据已发送，我的所有调用最终都会在服务器端得到一个空的正文。

使用 graphiql 时，请求成功。我正在尝试尽可能模仿来自 React 的 graphiql 请求，但正文始终是空白的。

这是电话:

fetch('/api', {
    'method': 'post',
    'credentials': 'include',
    'headers': {
        'Content-Type': 'application/json',
    },
    'body': JSON.stringify({
        "query": "mutation {UpdateActionStatus(input: {actionId: 61, status: TO_DO}) { id }}",
        "variables": null
    }),
}).then(r => {
    console.log(r.json());

    return r.json();
}).catch(error => {
    console.log('There has been a problem with your fetch operation: ', error.message);
});

我尝试将 mode 设置为 cors、no-cors、same-origin、导航:这些都不起作用。

我尝试过 Firefox 和 Chrome:仍然没有成功。

将内容类型更改为 application/graphql 似乎也不起作用。

在 stackoverflow 和其他地方，我在使用 fetch 时看到了许多处理响应和请求中的空主体的问题，但找到的解决方案似乎都不能解决我的问题。

我还尝试了以下更粗暴的调用，但无济于事。看来我根本无法使用 fetch，原因我无法解释:

fetch('/api', {
    'method': 'post',
    'credentials': 'include',
    'headers': {
        'Content-Type': 'application/x-www-form-urlencoded',
    },
    'body': 'test=test',
});

该怎么办？我在这里错过了一些简单的东西吗？

Answer 1

确保您正确发送 Content-Type 和 Accept header 。

'Accept': 'application/json',
'Content-Type': 'application/json',