Pengendalian Ralat Elegan dan Keselamatan jenis Hujung ke Hujung dengan Hono RPC

Saya sentiasa mempunyai hubungan cinta-benci dengan pengendalian ralat JavaScript. Pergantungannya pada blok cuba-tangkap dan pengecualian melontar mungkin berkesan untuk orang lain, tetapi ia pastinya mengecewakan saya kadang-kadang.

Pertimbangkan corak pengendalian ralat JavaScript biasa ini:

async function fetchData(url) {
  try {
    const response = await fetch(url);
    if (!response.ok) {
      throw new Error(`HTTP error! Status: ${response.status}`);
    }
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error("Error fetching data:", error.message);
  }
}

Itu banyak kod dan kami masih tidak tahu jenis ralatnya.

Pendapat saya ialah apabila menangani ralat, anda ingin tahu apa yang menyebabkan ralat, dari mana ia datang, dan jenis ralatnya dan atasinya dengan segera. Terutama apabila anda berada dalam persekitaran pelayan. Bagi saya

---

Cara golang

Saya lebih suka mengendalikan ralat seperti cara golang mengendalikannya, pada asasnya ralat sebagai nilai.

data, err := getData()
if err != nil {
  // handle error
}

Dengan cara ini anda menangani ralat dengan segera dan anda tidak perlu risau tentang kod yang lain berjalan jika terdapat ralat.

Supabase melakukan perkara yang sama dengan perpustakaan supabase-js mereka.

const { data, error } = await supabase.from("users").select("*");
if (error) {
  // handle error
}

---

Pengendalian Ralat Anggun dengan Hono RPC

Mari kita bercakap tentang bintang utama rancangan itu

const onSubmit = async (data: SignUpSchema) => {
  const res = await callRpc(api.auth.signup.$post({ json: data }));

  if (res.error) {
    toast.error(res.error);
    return;
  }

  toast.success("Account created successfully");
  router.navigate({ to: "/" });
};

Fungsi ini mungkin tidak kelihatan banyak, tetapi ia menyediakan parameter JSON selamat jenis melalui RPC. Ia mengendalikan semua ralat dan mengembalikan objek yang mengandungi sama ada data atau ralat, dengan jenis data disimpulkan daripada definisi RPC berdasarkan jenis pulangan titik akhir.

---

Menyediakan pengendalian ralat yang anggun

Sediakan Hono Rpc menggunakan dokumentasi rasmi

Menyediakan pengendali ralat Hono

Halaman belakang hendaklah sentiasa mengembalikan respons teks dengan mesej ralat dan kod status.

export const errorHandler = (err: Error | HTTPException, c: Context) => {
  console.log("=== Caught Error ===");
  if (err instanceof HTTPException) {
    return c.text(err.message, err.status);
  }
  if (err instanceof z.ZodError) {
    return c.text(err.errors.map((err) => err.message).join(",\n"), 400);
  }
  console.error(err);
  return c.text("Something went wrong", 500);
};

// Add as a errorHandler on the Hono instance
const app = new Hono();
app.onError(errorHandler);

Berdasarkan dokumentasi Hono anda harus membuang HTTPException seperti ini

import { HTTPException } from "hono/http-exception";

app.post("/", async (c, next) => {
  if (somethingWentWrong) {
    throw new HTTPException(401, { message: "Custom error message" });
  }
  return c.json({ message: "Success" });
});

Sekarang kami tahu bahawa jika terdapat ralat, kami akan sentiasa menerima balasan teks dengan mesej ralat dan kod status.

---

3. Sediakan pengendali ralat di bahagian hadapan

import { ClientResponse, hc } from "hono/client";
import type { ApiRoutes } from "../../../backend/app";
const client = hc<ApiRoutes>("/");

export const callRpc = async <T>(
  rpc: Promise<ClientResponse<T>>
): Promise<{ data: T; error: null } | { data: null; error: string }> => {
  try {
    const data = await rpc;

    if (!data.ok) {
      const res = await data.text();
      return { data: null, error: res };
    }

    const res = await data.json();
    return { data: res as T, error: null };
  } catch (error) {
    return { data: null, error: (error as Error).message };
  }
};

export default client.api;

callRpc secara automatik akan membuat kesimpulan jenis data berdasarkan definisi RPC dan mengembalikan objek yang mengandungi sama ada data atau ralat.

---

4. Penggunaan

Semuanya selamat dari apa yang anda hantar kepada apa yang anda terima

const onSubmit = async (data: SignUpSchema) => {
  const res = await callRpc(api.auth.signup.$post({ json: data }));

  if (res.error) {
    toast.error(res.error);
    return;
  }

  toast.success("Account created successfully");
  router.navigate({ to: "/" });
};

Saya telah bekerja dalam pangkalan kod di mana ia disediakan seperti ini dan ia merupakan pengalaman pembangun paling lancar yang pernah saya miliki. Saya hanya di sini untuk berkongsi.

---

Kelemahan

• Halaman belakang terhad kepada teks yang dikembalikan untuk ralat dan JSON untuk respons kejayaan
• Melakukan corak ini beralih daripada cara idiomatik mengendalikan ralat dalam javascript
• Anda perlu menangani ralat dengan segera, yang mungkin bukan yang anda mahukan

Atas ialah kandungan terperinci Pengendalian Ralat Elegan dan Keselamatan jenis Hujung ke Hujung dengan Hono RPC. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!