Typesikre API'er fra frontend til backend med tRPC · Lektion

Håndtering af tRPC-fejl

Implementér bedste praksis for at fange og håndtere fejl i tRPC-procedurer og middleware.

Lektion 1 af 411 trin

Håndtering af tRPC-fejl er en gratis Typesikre API'er fra frontend til backend med tRPC-lektion på CoddyKit. Dette er lektion 1 af 4. Du kan læse alle 3 lektioner i dette læringsspor gratis i deres fulde længde — derefter låser CoddyKit PRO alle lektioner op samt praktiske øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Den er en del af læringsforløbet i Typesikre API'er fra frontend til backend med tRPC, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Typesikre API'er fra frontend til backend med tRPC-kurset indeholder 4 lektioner i alt.

API-fejl: Et nødvendigt onde

I enhver robust API er fejl uundgåelige. Brugere kan sende ugyldige data, ressourcer findes måske ikke, eller eksterne tjenester kan svigte.

Det er afgørende at implementere en god fejlhåndtering for at skabe stabile og brugervenlige applikationer. Det gør det muligt for din API at svare forudsigeligt og informativt.

Sådan håndterer tRPC fejl

Som standard opfanger tRPC automatisk alle JavaScript-fejl, der kastes i dine procedurer eller middleware. Det serialiserer dem og sender dem til klienten.

Generiske fejl knyttes ofte til statuskoden INTERNAL_SERVER_ERROR (HTTP 500) på klientsiden, hvis de ikke håndteres eksplicit. Prøv at køre dette eksempel for at se en generisk fejl.

function fetchData(shouldFail: boolean) {
  if (shouldFail) {
    throw new Error("Something went wrong on the server!");
  }
  return "Data fetched successfully.";
}

function main() {
  try {
    console.log("Attempting to fetch (success):");
    console.log(fetchData(false));
  } catch (error: any) {
    // This catch block demonstrates local error handling
    // tRPC server would catch and serialize if not handled here
    console.log(`Caught error: ${error.message}`);
  }

  try {
    console.log("\nAttempting to fetch (fail):");
    fetchData(true);
  } catch (error: any) {
    console.log(`Caught error: ${error.message}`);
  }
}

main();

Standardisering med TRPCError

For at levere strukturerede og forudsigelige fejlbeskeder tilbyder tRPC klassen TRPCError. Det er tRPC's særlige måde at udløse API-specifikke fejl på.

  • TRPCError giver dig mulighed for at angive en code (f.eks. en HTTP-status) og en message, der kan læses af mennesker.
  • Den sikrer ensartede fejlindhold, så klienter lettere kan fortolke og reagere på forskellige fejltyper.

<code>TRPCError</code>s opbygning

Når du opretter en TRPCError, sender du et objekt med en code og en message. code svarer til standardiserede HTTP-statuskoder (f.eks. NOT_FOUND, UNAUTHORIZED).

Dette eksempel viser, hvordan du udløser forskellige TRPCError-typer baseret på betingelser.

import { TRPCError } from '@trpc/server';

function simulateError(type: string) {
  if (type === 'not_found') {
    throw new TRPCError({
      code: 'NOT_FOUND',
      message: 'Resource does not exist.'
    });
  }
  if (type === 'bad_input') {
    throw new TRPCError({
      code: 'BAD_REQUEST',
      message: 'Invalid input provided.'
    });
  }
  return 'No error was simulated.';
}

function main() {
  try {
    console.log("Simulating 'not_found' error:");
    simulateError('not_found');
  } catch (error: any) {
    if (error instanceof TRPCError) {
      console.log(`TRPC Error Code: ${error.code}`);
      console.log(`TRPC Error Message: ${error.message}`);
    } else {
      console.log(`Generic Error: ${error.message}`);
    }
  }
}

Håndtering af fejl i procedurer

Dine tRPC-procedurer indeholder den centrale forretningslogik. Det er god praksis at omslutte handlinger, der kan mislykkes (f.eks. databasekald eller API-anmodninger), med try...catch-blokke.

I catch-blokken kan du omdanne generiske fejl til specifikke TRPCError-instanser, så klienten får tydelig feedback.

Eksempel: Håndtering af procedurefejl

Dette eksempel simulerer en procedure, der forsøger at hente en bruger fra en database. Den håndterer både en manglende bruger og en fejl i databaseforbindelsen ved at omdanne dem til passende TRPCError-typer.

import { TRPCError } from '@trpc/server';

// Simulate a database call
function fetchUserFromDB(id: string) {
  if (id === 'db_error') {
    throw new Error("Database connection failed!");
  }
  if (id === '123') {
    return { id: '123', name: 'Alice' };
  }
  return null;
}

// Simulate a tRPC query procedure
function getUserQuery(userId: string) {
  try {
    const user = fetchUserFromDB(userId);
    if (!user) {
      throw new TRPCError({
        code: 'NOT_FOUND',
        message: 'User not found.'
      });
    }
    return user;
  } catch (error: any) {
    if (error instanceof TRPCError) {
      throw error; // Re-throw tRPC errors directly
    }
    // Catch generic errors and convert them to TRPCError
    throw new TRPCError({
      code: 'INTERNAL_SERVER_ERROR',
      message: `Failed to fetch user: ${error.message}`
    });
  }
}

function main() {
  try {
    console.log("Fetching user '123':");
    console.log(getUserQuery('123'));
  } catch (error: any) {
    console.log(`Error: ${error.code} - ${error.message}`);
  }

  try {
    console.log("\nFetching user 'db_error':");
    getUserQuery('db_error');
  } catch (error: any) {
    console.log(`Error: ${error.code} - ${error.message}`);
  }
}

Fejlhåndtering i middleware

tRPC-middlewarefunktioner udføres før procedurerne. De er ideelle til globale kontroller som godkendelse, autorisation eller logning.

Hvis en middlewarefunktion udløser en TRPCError, bliver den procedure, som funktionen beskytter, ikke udført, og fejlen sendes straks videre til klienten. Det er effektivt til at beskytte dit API.

Eksempel: Autorisationsfejl i middleware

Denne middleware kontrollerer, om brugeren har rollen 'admin'. Hvis ikke, udløser den en UNAUTHORIZED-fejl, så efterfølgende procedurer ikke bliver kørt.

Det sikrer, at kun autoriserede brugere kan fortsætte.

import { TRPCError } from '@trpc/server';

// Simulate a tRPC middleware logic
// In a real tRPC app, `ctx` would contain user info
function authMiddleware(userRole: string) {
  if (userRole !== 'admin') {
    throw new TRPCError({
      code: 'UNAUTHORIZED',
      message: 'You are not authorized to perform this action.'
    });
  }
  return { success: true, message: 'Authorized' }; // Simulates `next()`
}

function main() {
  console.log("Attempting with 'user' role:");
  try {
    authMiddleware('user');
  } catch (error: any) {
    if (error instanceof TRPCError) {
      console.log(`Middleware Error: ${error.code} - ${error.message}`);
    }
  }

  console.log("\nAttempting with 'admin' role:");
  try {
    authMiddleware('admin');
    console.log("Middleware passed: User is an admin!");
  } catch (error: any) {
    console.log("This block should not be reached for admin.");
  }
}

main();

Videreførsel af fejl til klientsiden

Når din tRPC-server udløser en TRPCError, modtager tRPC-klienten et struktureret fejlobjekt. Dette objekt indeholder typisk:

  • code: tRPC-fejlkoden (f.eks. 'NOT_FOUND').
  • message: Den beskrivende fejlbesked.
  • data: Yderligere fejldata, herunder HTTP-statuskoden.

Det giver din frontend mulighed for at reagere specifikt på forskellige fejltyper og dermed forbedre brugeroplevelsen.

Kontrol af fejlhåndtering

Forestil dig en tRPC-procedure, der henter et blogindlæg. Hvis brugeren, der sender anmodningen, er godkendt, men ikke har de nødvendige tilladelser til at se det pågældende indlæg, hvilken TRPCError-kode vil det være mest passende at udløse?

Opsummering: Fejl på en robust måde

Du har lært, hvordan du håndterer fejl på en robust måde i tRPC!

  • tRPC fanger automatisk generiske fejl, men TRPCError giver struktur.
  • Brug TRPCError med specifikke code-værdier (f.eks. NOT_FOUND, UNAUTHORIZED) og beskeder.
  • Implementer try...catch i procedurer for at omdanne generiske fejl til TRPCError-fejl.
  • Brug middleware til at håndhæve globale kontroller (f.eks. godkendelse) ved tidligt at udløse TRPCError-fejl.
  • Klienter modtager strukturerede fejlobjekter, hvilket giver bedre fejlhåndtering i frontend.
Gratis at komme i gang

Lær Typesikre API'er fra frontend til backend med tRPC med en AI-underviser — gratis

Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.

Kurser
10
Lektioner
40

Ofte stillede spørgsmål

Er lektionen “Håndtering af tRPC-fejl” gratis?

Ja — alle 3 lektioner i læringssporet Typesikre API'er fra frontend til backend med tRPC, inklusive “Håndtering af tRPC-fejl”, kan læses gratis i deres fulde længde her på webstedet. Derefter låser CoddyKit PRO alle lektioner op samt interaktive øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Typesikre API'er fra frontend til backend med tRPC-kurset indeholder 4 lektioner i alt.

Hvad lærer jeg i “Håndtering af tRPC-fejl”?

Implementér bedste praksis for at fange og håndtere fejl i tRPC-procedurer og middleware. Du øver dig i Typesikre API'er fra frontend til backend med tRPC med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.

Skal jeg have erfaring for at begynde på Typesikre API'er fra frontend til backend med tRPC?

Der kræves ingen tidligere erfaring. Typesikre API'er fra frontend til backend med tRPC på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 1 af 4.

Hvor lang tid tager lektionen “Håndtering af tRPC-fejl”?

De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.

Kan jeg skrive og køre kode i denne Typesikre API'er fra frontend til backend med tRPC-lektion?

Ja. Alle Typesikre API'er fra frontend til backend med tRPC-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.

Alle lektioner i dette kursus

  1. Håndtering af tRPC-fejl
  2. Tilpassede fejltyper
  3. Datatransformere til serialisering
  4. Formatering af fejl og valideringsfeedback på feltniveau
← Tilbage til Typesikre API'er fra frontend til backend med tRPC