如何在 onError 回调中使用异步错误处理程序？ 使令牌链接无效

问题描述

我正在创建一个链接以删除来自服务器的 401 响应中的用户身份验证令牌。这里的问题是，在我的案例 AsyncStorage 中，我需要从存储中删除令牌，顾名思义，它执行异步操作，但是如果我尝试将异步函数传递给 onError 回调来自@apollo/client/link/error，代码编辑器立即抛出以下错误：Type 'Promise<void>' is not assignable to type 'void | Observable<FetchResult<{ [key: string]: any; },。

那么有没有办法将异步回调传递给 onError？

使令牌链接无效

import {ErrorResponse,onError} from '@apollo/client/link/error';

import {isJwtError,JWTError} from './errors';
// async function to remove auth token from asyncstorage
import {removetokens} from './utils';

interface ResponseError extends ErrorResponse {
  networkError?: Error & {
    statusCode?: number;
    bodyText?: string;
  };
}

export const invalidatetokenLink = onError((error: ResponseError) => {
  if (
    (error.networkError && error.networkError.statusCode === 401) ||
    error.graphQLErrors?.some(isJwtError)
  ) {
    if (error.graphQLErrors[0].extensions.code !== JWTError.expired) {
      // this is where I run an asynchronous function to remove the token
      removetokens();
    }
  }
});

解决方法

错误消息提到您可以返回 Observable<FetchResult<{ [key: string]: any; }。似乎 apollo-client 使用了 zen-observable 库。

您可以根据您的承诺构建一个可观察的对象。或者使用 observable-helpers 中的 promiseToObservable 函数。