`openapi-fetch`でサーバー側のレスポンスがエラー相当の場合にデフォルトで例外を発生させる方法メモ

openapi-fetchを使っていてサーバー側のレスポンスがエラー相当の場合にデフォルトで例外を発生させる方法メモしておきます。

openapi-ts.dev

以下の記事で記載の通り、openapi-fetchでは例外がthrowされません。

レスポンスエラーと思われるようなステータス(400系、500系)が返されてもthrowされない点は注意です。 openapi-typescript + openapi-fetchを使ってOpenAPIのスキーマから型情報とクライアントを自動生成するメモ - Madogiwa Blog

毎回response.statusを確認して例外をthrowするのは手間なのでMiddlewareを使ってresponse.statusを確認して例外を発生させるようにしました。

以下がサンプルコードです。

import createClient, { type Middleware } from "openapi-fetch";

export class FetchError extends Error {
  response: Response;

  constructor(message: string, response: Response) {
    super(message);
    this.message = message;
    this.response = response;
    this.name = "FetchError";
  }
}

const fetchResponseRaiseErrorMiddleware: Middleware = {
  onResponse({ response }) {
    if (response.status >= 400) throw new FetchError("request failed", response);
    return response;
  },
};

export const openApiFetchClient = createClient<paths>({});
openApiFetchClient.use(fetchResponseRaiseErrorMiddleware);

openapi-fetch、機能的にはシンプルですがこういったMiddlewareを使って色々と拡張できるの便利ですね👍