javascript / beginner
Snippet
Abfangen von asynchronen Datenabruffehlern mit Try-Catch-Blöcken
Die Verwendung von Try-Catch-Blöcken in asynchronen Funktionen stellt sicher, dass Netzwerk- oder Serverfehler abgefangen werden, ohne Next.js Server Components zum Absturz zu bringen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
// app/data/page.jsexport async function getProductData(id) {try {const response = await fetch(`https://api.example.com/items/${id}`);if (!response.ok) throw new Error('Network response failed');return await response.json();} catch (error) {return { error: error.message };}}
nextjs
Erklärung
1
export async function getProductData(id) {
Deklariert eine asynchrone Funktion zum Abrufen von Serverdaten.
2
try {
Startet einen geschützten Try-Block für potenziell fehlschlagende asynchrone Operationen.
3
const response = await fetch(`https://api.example.com/items/${id}`);
Wartet auf die Antwort der asynchronen HTTP-Anfrage vom entfernten Server.
4
if (!response.ok) throw new Error('Network response failed');
Prüft, ob der Antwortstatus außerhalb von 200-299 liegt, und wirft gegebenenfalls einen Fehler.
5
} catch (error) {
Fängt alle im Try-Block aufgetretenen Laufzeit- oder Netzwerkausnahmen ab.
6
return { error: error.message };
Gibt ein sicheres Fehlerobjekt-Fallback zurück, anstatt den Programmablauf zu unterbrechen.