Turn a failed fetch request into a message the user understands

My fetch call fails and the page just sits there blank, with nothing in the console telling me or the user what happened.

Beginner to intermediateRead 5 minDoing: about an hour7 steps

▶ Start

What you'll have at the end

A fetch wrapper that shows one specific, honest message, a dropped connection, a bad status, or an unreadable reply, plus a Retry button that recovers, instead of a blank page.

Before you start

You need

A page whose script already calls fetch to load data and renders the response, with no check on whether the request actually succeeded.

Not covered

Retrying automatically on a timer, or moving this wrapper into a shared file other pages import, isn't covered here; this fixes one page's own Retry button.

Leans on

7 steps

Where to go next

Stop an old search reply from overwriting a newer one

when repeated requests come from fast typing into a search box instead of a single Retry click, that race needs its own pattern

Checked 21 Aug 2026

Part of the JavaScript cookbook