neverthrow と fetch と zod を組み合わせた非同期処理【タイムアウト編】

fetch("https://jsonplaceholder.typicode.com/todos/", {
  signal: AbortSignal.timeout(5 * 1000), // 5秒でタイムアウトとする
})
  .then((result) => result.json())
  .then((data) => { console.log(data) })
  .catch((error) => {
    if (error.name === "TimeoutError") {
      // タイムアウトした場合の処理
      console.error("Timeout Error");
    } else {
      console.error("Other Error");
    }
  });

import { ResultAsync } from "neverthrow";

/**
 * neverthrow の ResultAsync と fetch を組み合わせた関数です。
 */
export const handleFetch = <R, P = unknown>({
  path,
  method = "GET",
  requestParams,
  timeoutMilliSecond = 30 * 1000, // タイムアウトの時間を追加。デフォルトで 30 秒 …(1)
}: {
  path: string;
  method?: "GET" | "POST" | "PUT" | "DELETE";
  requestParams?: P;
  timeoutMilliSecond?: number;
}): ResultAsync<R, Error> => {
  const params: RequestInit = {
    method,
    signal: AbortSignal.timeout(timeoutMilliSecond), // signal を追加 …(2)
  };
  if ((method === "POST" || method === "PUT") && requestParams) {
    params.body = JSON.stringify(requestParams);
  }

  return ResultAsync.fromPromise(
    fetch(`${path}`, params).then((response) => {
      if (!response.ok) {
        throw new Error("サーバーとの通信に失敗しました");
      }

      return response.json().then((data: R) => {
        const isR = isTypeR<R>(data);
        if (!isR) {
          throw new Error("レスポンスの形式が不正です");
        }
        return data;
      });
    }),
    (error) => {
      if (error instanceof Error) {
        if (error.message === "サーバーとの通信に失敗しました") {}
        if (error.message === "レスポンスの形式が不正です") {}
        if (error.name === "TimeoutError") {
          // タイムアウト時の処理をココに記述する …(3)
          return new Error("サーバーが所定時間内に応答しませんでした");
        }

        return error;
      }
      return new Error("不明なエラーが発生しました");
    }
  );
};

/**
 * fetch の戻り値を推論するための型ガード
 */
const isTypeR = <R>(data: unknown): data is R => {
  return typeof data === "object" && data !== null;
};

import { err, ok } from "neverthrow";
import { z, ZodError } from "zod";
import { handleFetch } from "./neverthrow_fetch";

type Todo = {
  id: number;
  userId: number;
  title: string;
  completed: boolean;
};

const run = (id: number) => {
  ok(z.number().min(1).max(100).safeParse(id))
    .andThen((id) => {
      if (!id.success) return err(id.error);
      return ok(id.data);
    })
    .asyncAndThen((id) => {
      return handleFetch<Todo>({
        path: `https://jsonplaceholder.typicode.com/todos/${id}`,
        timeoutMilliSecond: 10 * 1000, // タイムアウトの時間を明示的に設定
      });
    })
    .map((result) => {
      console.log(result);
    })
    .mapErr((error) => {
      if (error instanceof ZodError) {
        console.log("zod エラー", error);
      } else {
        // タイムアウトが発生した場合は「サーバーが所定時間内に応答しませんでした」が出力される
        console.log("API エラー", error);
      }
    });
};

run(1)