remotion-dev/remotion · error · Error

Could not read media metadata for ${src}

Error message

Could not read media metadata for ${src}

What it means

Remotion Studio's asset metadata reader throws this when `getMediaMetadata()` returns null for a video or audio asset, meaning the browser could not load and parse the media file's metadata. The source URL is constructed from the passed `src` (or the current canvas asset) possibly with a cache-busting timestamp. A null result means the media element failed to load entirely — wrong URL, unsupported codec, CORS failure, or a missing file.

Source

Thrown at packages/studio/src/helpers/get-asset-metadata.ts:157

			if (!contentLength) {
				throw new Error('Unexpected error: content-length is null');
			}

			size = Number(contentLength);
		}

		const fetchedAt = Date.now();
		const srcWithTime = addTime ? addAssetCacheBust({fetchedAt, src}) : src;

		const fileType = getPreviewFileType(
			canvasContent.type === 'asset' ? canvasContent.asset : src,
		);

		if (fileType === 'video' || fileType === 'audio') {
			const mediaMetadata = await getMediaMetadata(srcWithTime);
			if (mediaMetadata === null) {
				throw new Error(`Could not read media metadata for ${src}`);
			}

			const width = mediaMetadata.width ?? 1920;
			const height = mediaMetadata.height ?? 1080;
			return {
				type: 'found',
				size,
				dimensions: {width, height},
				fetchedAt,
				mediaMetadata,
			};
		}

		if (fileType === 'image') {
			const resolution = await new Promise<AssetMetadata>((resolve, reject) => {
				const img = new Image();
				img.onload = () => {
					resolve({

View on GitHub (pinned to b2f4e34732)

Solutions

1. Verify the src URL resolves: open it directly in the browser and confirm the media plays
2. If the file lives in public/, reference it as '/filename.ext' from staticFile() and confirm the file exists with exact casing
3. For remote media, ensure the server sends Access-Control-Allow-Origin headers
4. Re-encode the file to a web-safe codec (H.264/AAC in MP4 or WebM) if the browser can't decode it
5. Check the Network tab for the failing media request (404, CORS error, or decode error)

Example fix

// before
<Video src="/MyVid.mp4" /> // wrong casing, 404s on case-sensitive servers

// after
import staticFile from '@remotion/static-file';
<Video src={staticFile('myvid.mp4')} />

// Probe the asset before relying on metadata
const probe = document.createElement('video');
probe.preload = 'metadata';
probe.src = src;
await new Promise((res) => {
  probe.onloadedmetadata = res;
  probe.onerror = res;
});
if (probe.readyState < 1) {
  // src is unloadable; fix path/CORS/codec before calling getAssetMetadata
}

const canLoadMediaMetadata = async (src: string): Promise<boolean> => {
  const el = document.createElement(src.match(/\.mp4$|\.webm$|\.mov$/i) ? 'video' : 'audio');
  el.preload = 'metadata';
  el.src = src;
  return new Promise((resolve) => {
    el.addEventListener('loadedmetadata', () => resolve(true), {once: true});
    el.addEventListener('error', () => resolve(false), {once: true});
  });
};

try {
  const meta = await getAssetMetadata({src});
} catch (err) {
  if (err instanceof Error && err.message.startsWith('Could not read media metadata for')) {
    // fall back to placeholder dimensions and log the failing src
  }
  throw err;
}

When it happens

Trigger: Calling getAssetMetadata with a video/audio `src` that 404s, is blocked by CORS, points to a file outside the public folder, uses a codec the browser can't decode (e.g. certain HEVC/proprietary formats), or references a relative path that doesn't resolve to the Studio's dev server.

Common situations: Typos or wrong-case filenames in <Video src>/<Audio src>; assets in a public/ folder that isn't configured; absolute filesystem paths used as src; serving media from a CDN without CORS headers; broken asset imports after moving files; very large files still uploading.

Related errors

• The media ${ref.src} cannot be seeked. This could be one of
• Could not determine duration of ${src}, but "loop" was set.
• No src passed
• No audio stream found in '${input_path}'. Ensure the video c
• You have passed a volume of type ${typeof props.volume} to y

AI-assisted analysis of remotion-dev/remotion@b2f4e34732 (2026-08-28). Data as JSON: /api/errors/793f0405eea8ed0f. Report an issue: GitHub.