使用 fetch 时清空请求正文

Question

我正在尝试使用 fetch 从 React 组件调用 graphql 到 PHP 服务器。这是我第一次尝试使用 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、navigate：none 这些工作。

我已经尝试过使用 Firefox 和 Chrome：还是不行。

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

在 Whosebug 和其他地方使用 fetch 时，我在响应和请求中看到了很多处理空体的问题，但是 none 找到的解决方案似乎解决了我的问题。

我还尝试了以下更粗略的调用，但无济于事。由于我无法解释的原因，我似乎根本无法使用 fetch：

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

怎么办？我在这里遗漏了一些简单的东西吗？

Answer 1

我现在将 GraphQL 与 React 结合使用，而不是直接使用 fetch，而且大多数情况下效果很好。

Answer 2

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

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

使用 fetch 时清空请求正文

Empty request body when using fetch

javascript

ajax

symfony

graphql

fetch-api