Reactjs/Apollo/AppSync 突变触发两次

我遇到了 React/Apollo/AppSync 的问题，突变触发了两次（或多次）。我有一个 React 应用程序，它有一个由通常的 UI 按钮 onClick 触发的更新突变。

<button className={`btn btn-sm`} onClick={(event) => { that.toggleSubscription(event, subscriptionid, serviceid, status); }}>
    <i className={`fas ${icon} fa-fw`} />
    {title}
</button>

toggleSubscription 函数如下所示：

toggleSubscription = async (event, subscriptionid, serviceid, currentStatus) => {
    event.preventDefault();
    event.stopPropagation();

    if (currentStatus === "mandatory") return;
    console.log(serviceid);
    await this.props.toggleSubscription(this.props.match.params.id, serviceid);
}

以及所讨论的 graphql 突变（尽管这似乎发生在所有突变上）。这是出口声明上的：

export default compose(
    graphql(
        MutationToggleSubscription,
        {
            props: ({ ownProps, mutate }) => ({
                toggleSubscription: (personid, serviceid) => mutate({
                    variables: { personid: personid, serviceid: serviceid }
                })
            }),
        }
    ),
...

显示对 GraphQL 服务器的多个并发调用 https://i.stack.imgur.com/Gk00o.png电话是almost相同，但有一些额外的堆栈跟踪调用：这两个请求几乎相同。以红色突出显示的调用似乎是两者之间的区别 https://i.stack.imgur.com/twB8s.png

任何帮助将不胜感激！

我有同样的问题。在我的例子中，突变会持续很长时间。由于向服务器发出了第二个 POST 请求，因此突变解析器被调用两次。但客户端只发出一个请求，这从浏览器开发人员工具的“网络”选项卡中可以明显看出。

据我发现，该问题不是由 apollo 服务器或客户端引起的。

经过大量研究后，我发现Node.js 服务器默认在 120 秒后超时请求并关闭与客户端的连接。这反过来又导致浏览器重试请求 https://stackoverflow.com/a/19697278/6385825但浏览器不会在开发人员工具的网络选项卡中记录重试的请求，这会造成很多混乱。

So, 更改请求超时时间 https://stackoverflow.com/a/58372968/6385825ExpressJS 服务器为我解决了这个问题。

最初发布here https://github.com/apollographql/apollo-server/issues/2589#issuecomment-664530763