javascript / expert
Snippet
Isomorpher Fetch-Wrapper mit Fehlerbehandlung
Ein isomorpher Fetch-Wrapper gewährleistet eine konsistente Fehlerbehandlung sowohl in serverseitigen Load-Funktionen als auch bei clientseitigen Interaktionen. Die Übergabe des Fetchers als Argument erhält die Kompatibilität mit der spezialisierten Fetch-Implementierung von SvelteKit.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
export async function apiFetch(url, fetcher = fetch) {try {const response = await fetcher(url);if (!response.ok) {throw new Error(`HTTP Error: ${response.status}`);}return await response.json();} catch (err) {console.error('Fetch failed:', err);return { error: true, message: err.message };}}
svelte
Erklärung
1
fetcher = fetch
Standardmäßig das globale Fetch, ermöglicht aber das Injizieren des SvelteKit-Fetch für serverseitige relative URL-Unterstützung.
2
if (!response.ok)
Prüft explizit auf Nicht-2xx Status-Codes, die im nativen Fetch-API keinen Catch-Block auslösen.
3
return { error: true, ... }
Gibt eine vorhersehbare Objektstruktur zurück, um UI-Abstürze in der aufrufenden Komponente zu verhindern.