使用Apollo的useMutation重新验证后重新发送graphql突变

时间:2020-06-23 20:57:58

标签: graphql react-hooks apollo react-apollo react-apollo-hooks

我遇到一个问题,我们正在使用apollo客户端,特别是useMutation react钩子对我们的GraphQL Server执行变异调用。 在某些时候,服务器可能会返回401未经授权的响应-此时,我们可以调用特殊端点,该端点对客户端进行重新身份验证并刷新cookie /令牌。 我希望能够在客户端重新通过身份验证后再次重新运行相同的变异。因此,基本上我想知道是否可以执行以下操作: useMutation->接收401未经授权->调用以刷新令牌->重新运行相同的初始突变 这是我们的useMutation的样子:

 const [mutationFunction, { data, ...rest }] = useMutation(query, {
    onError(_err: any) {
        const networkError = error?.networkError as any;
        if (networkError?.statusCode === 401 && !refreshFailed) {
            // eslint-disable-next-line prefer-destructuring
            loading = true;
            error = undefined;

            fetch('/authentication/refresh', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' }
            })
                .then(response => response.json())
                .then(token => {
                    localStorage.setItem(jwtLocalStorageKey, token);
                    // re fetch here
                })
                .catch(() => {
                    refreshFailed = true;
                });
        } else {
            showAlert(_err.message, 'error');
        }
    }
});

这是我们目前的称呼方式:

  const {
    mutationFunction: updateTournamentUserMutation,
    loading: updateTournamentUserLoading,
    error: updateTournamentUserError,
    data: updateTournamentUserData
} = useMutationHook(gqlUpdateTournamentUser);

 updateTournamentUserMutation({ variables: { input } });

因为我们在上面使用钩子和上面使用钩子的方式,所以我不完全确定如何保存或重用最初在第一个突变中发送的相同数据(即突变参数) 可以使用当前的方式来做到这一点吗?

0 个答案:

没有答案