javascript / expert
Snippet
Kaskadierender Abbruch-Timeout mit AbortSignal.any in Next.js Data Fetching
Verwendet AbortSignal.any zur eleganten Kombination von festen Request-Timeouts mit externen Routennavigations-Abbruchsignalen in Next.js Fetch-Pipelines ohne manuelles Event-Listener-Handling.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
export async function fetchWithCompositeTimeout(url: string, userSignal?: AbortSignal) {const timeoutSignal = AbortSignal.timeout(3000);const combinedSignal = userSignal ? AbortSignal.any([timeoutSignal, userSignal]) : timeoutSignal;const response = await fetch(url, {signal: combinedSignal,next: { revalidate: 60 }});return response.json();}
nextjs
Erklärung
1
const timeoutSignal = AbortSignal.timeout(3000);
Erzeugt eine AbortSignal-Instanz, die nach maximal 3000 Millisekunden automatisch abbricht.
2
const combinedSignal = userSignal ? AbortSignal.any([timeoutSignal, userSignal]) : timeoutSignal;
Fügt mehrere AbortSignal-Instanzen zu einem gemeinsamen Signal zusammen, das auslöst, sobald ein Teilsignal abbricht.