Lingua-e
JavaScript

What is a Fetch Network Error?

← Errors

fetch() rejects with a TypeError when a network-level failure prevents the request from completing. This is different from an HTTP error status (4xx/5xx): a network error means no response was received at all. Common causes include the server being down, DNS resolution failure, or a CORS preflight rejection.

Why it happens

  • •The server is not running or the URL is unreachable.
  • •A CORS preflight (OPTIONS) request was rejected before the main request.
  • •The browser is offline or the network connection dropped.
  • •An invalid URL scheme or hostname causes DNS resolution to fail.

Examples

JavaScript

Code that triggers the error

const data = await fetch("https://localhost:9999/api");
const json = await data.json();

Error output

TypeError: Failed to fetch

How to fix it

Distinguish network errors (TypeError) from HTTP errors (non-ok status). Check the URL and ensure the server is running. Handle both error types explicitly. Use navigator.onLine to provide offline-aware UI feedback.

Fixed code

try {
  const res = await fetch("https://api.example.com/data");
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
  const json = await res.json();
} catch (err) {
  if (err instanceof TypeError) {
    console.error("Network error:", err.message);
  } else {
    console.error("API error:", err.message);
  }
}

Related errors

Ready to practice your English at work?

Lingua-e has interactive exercises built around real developer conversations: standups, code reviews, retrospectives, and more. Practice until it comes naturally.

Try Lingua-e for free