🚀

apollo clientでエラーの時のステータスコードを取り出す

2022/02/18に公開

GraphQL

背景

GraphQLではエラー時でもステータスコードは200でerrorをレスポンスのボディに詰めて返すことが推奨されている

が、認証エラーなどはサーバー側の実装の都合でGraphQLのレイヤーまでいかずにレスポンスを返すことがあると思う。

今回はそういうケースで、レスポンスのステータスコードでメッセージを出し分けたかったが、少し嵌ったのでそのメモ

Apolloの公式ドキュメントではレスポンスの error.networkError からステータスコードを取得できると記述されていた

で、実際に取得しようと試みるも

補完に出てこない...

そこで、コードを追ってみるとレスポンスには必ずしも statusCode というプロパティが含まれた値が返ってくると限らないことがわかった。

   public networkError: Error | ServerParseError | ServerError | null;

ServerParseErrorとServerErrorの時のみstatusCodeが含まれてることがわかった

ServerParseError

export type ServerParseError = Error & {
  response: Response;
  statusCode: number;
  bodyText: string;
};

ServerError

export type ServerError = Error & {
  response: Response;
  result: Record<string, any>;
  statusCode: number;
};

解決策

以下のようにcastしてあげたら問題なく取り出せた

if (error.networkError?.name === 'ServerParseError' || error.networkError?.name === 'ServerError') {
    let parseErrorStatusCode = (error.networkError as ServerParseError).statusCode
    let serverErrorStatusCode = (error.networkError as ServerError).statusCode
}

tsだとcastしてあげないといけないので何が返ってくるか確認しないと嵌まりますね。以上。

背景

解決策

Discussion