Fetch API

The Fetch API is a built-in JavaScript interface, exposed as the fetch() function, for sending HTTP requests and reading responses. It returns a promise that resolves to a Response object.

Why it matters

Fetch is how most front ends talk to APIs. Its main surprise is error handling: the promise only rejects on network failure, not on HTTP errors. A 404 or 500 response still resolves, so you must check response.ok. Cross-origin requests also depend on CORS headers from the server.

Example

const res = await fetch('/api/status', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ site: 'example.com' })
});
if (!res.ok) throw new Error('HTTP ' + res.status);
const data = await res.json();

Common mistakes

• Assuming a failed status code throws an exception.
• Forgetting credentials: 'include' when cookies must be sent cross-origin.
• Not setting a timeout; use an AbortController to cancel slow requests.

Related

• AJAX
• CORS
• HTTP status code
• Service Worker
• Tool: Http status checker

This page is general information written by our editorial team and updated when documentation changes. Servers and providers differ, so test changes safely first. See our editorial policy and disclaimer.