remotion-dev/remotion · error · Error

HTTP error, status = ${res.status}

Error message

HTTP error, status = ${res.status}

What it means

prefetch() fetches a media URL to warm the browser cache before playback. After fetch() resolves it checks `res.ok`; any non-2xx HTTP status throws with the numeric status code. This surfaces network/server problems immediately rather than letting playback fail silently later.

Source

Thrown at packages/core/src/prefetch.ts:163

		resolve = res;
		reject = rej;
	});
	waitUntilDone.catch(() => undefined);

	const controller = new AbortController();
	let reader: ReadableStreamDefaultReader<Uint8Array> | null = null;

	fetch(srcWithoutHash, {
		signal: controller.signal,
		credentials: options?.credentials ?? undefined,
	})
		.then((res) => {
			if (canceled) {
				return null;
			}

			if (!res.ok) {
				throw new Error(`HTTP error, status = ${res.status}`);
			}

			const headerContentType = res.headers.get('Content-Type');

			const contentType = options?.contentType ?? headerContentType;
			const hasProperContentType =
				contentType &&
				(contentType.startsWith('video/') ||
					contentType.startsWith('audio/') ||
					contentType.startsWith('image/'));

			if (!hasProperContentType) {
				// eslint-disable-next-line no-console
				console.warn(
					`Called prefetch() on ${srcWithoutHash} which returned a "Content-Type" of ${headerContentType}. Prefetched content should have a proper content type (video/... or audio/...) or a contentType passed the options of prefetch(). Otherwise, prefetching will not work properly in all browsers.`,
				);
			}

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Open the URL directly in a browser to confirm it returns 2xx.
2. Verify the path resolves (use staticDirectory()/publicFolder helpers correctly).
3. Ensure the dev/preview server is running and serving the file.
4. If cross-origin, confirm the server sends Access-Control-Allow-Origin and survives the CORS preflight.

async function assertOk(url: string) {
  const res = await fetch(url, { method: 'HEAD' });
  if (!res.ok) throw new Error(`prefetch will fail: ${res.status}`);
}

try {
  await prefetch(src);
} catch (err) {
  if (/HTTP error, status =/.test(String(err))) {
    // log + fall back to direct src, or surface to the user
  } else throw err;
}

When it happens

Trigger: 404 for a missing asset, 403 forbidden, 500 server error, CORS preflight rejection, expired signed URL, wrong/typo path.

Common situations: Public-folder path typo; asset not deployed; dev server not running; signed/expired CDN URL; cross-origin without CORS headers.

Related errors

• HTTP response of ${srcWithoutHash} has no body
• Server returned status ${res.status} while fetching ${actual
• No body
• Failed to fetch audio data from ${src}: ${response.status} $
• Failed to upgrade Remotion, see logs above

AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12). Data as JSON: /api/errors/7de214aac9581ac1. Report an issue: GitHub.