_next/image 400 / upstream image response failed Next.js Origin: On your device OSI layer 7 · Application Last updated 5 Nov 2026

Next.js: ⨯ upstream image response failed for https://example.com/a.jpg 404 / url parameter is not allowed

The Image Optimization API couldn't fetch or accept the source image (404, blocked host, wrong type).

Exact message you may see upstream image response failed for https://example.com/a.jpg 404⨯ upstream image response failedurl parameter is not allowed _next/image"url" parameter is valid but upstream response is invalid400 Bad Request _next/image
Seen on: Next.js

Meaning

/_next/image fetches the remote image on the server. If it returns 404/403, isn't an image, or the host isn't in images.remotePatterns, you get 400/404 and a broken image. Verify the URL opens, configure remotePatterns, and for local images use static imports or /public paths.

Common causes

  • Remote URL returns 404/403/redirect
  • Host not in remotePatterns ("url parameter is not allowed")
  • Server can't reach the image host (firewall/DNS)
  • Unsupported format or too large
  • Hot-linking protection

⚡ Quick fix

  1. Open the image URL in a browser/curl
  2. Add to images.remotePatterns: [{ protocol: "https", hostname: "example.com" }]
  3. Use unoptimized for problematic sources

Detailed fix by platform

Next.js

  1. images: { remotePatterns: [{ protocol: "https", hostname: "cdn.example.com", pathname: "/**" }] }

How to diagnose

  1. Status — Upstream response?
  2. Config — remotePatterns?
  3. Network — Server reachable?

🔧 Still not fixed?

Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:

Where this error sits

Origin: On your device. Errors that are often confused with or caused by this one (click to open):

'sharp' is required to be installed in standalone mode — Next.js: Error: 'sharp' is required to be installed in standalone mode for the image optimization to function correctly (Next.js)'sharp' is required t…Conflicting app and page file was found — Next.js: ⨯ Conflicting app and page file was found, please remove the conflicting files to continue: "pages/index.tsx" - "app/page.tsx" (Next.js)Conflicting app and p…CORS error calling Next.js API route / route handler — Browser: Access to fetch at 'https://api.example.com/api/data' from origin 'https://app.example.com' has been blocked by CORS policy (Next.js route handler) (Next.js)CORS error calling Ne…Image with src must use "width" and "height" properties or "fill" — Next.js: Image with src "https://example.com/a.jpg" must use "width" and "height" properties or "fill" property (Next.js)Image with src must u…next build: fetch failed ECONNREFUSED (build-time API) — Next.js: Error occurred prerendering page "/blog" TypeError: fetch failed { cause: Error: connect ECONNREFUSED 127.0.0.1:3000 } (Next.js)next build: fetch fai…next build: JavaScript heap out of memory — Next.js: FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory (during next build) (Next.js)next build: JavaScrip…next/image hostname — Error: Invalid src prop on `next/image`, hostname "x" is not configured under images in your `next.config.js` (React)next/image hostname_next/ima…

Explore the map of this error Full error map →

🧠 Still stuck? Analyze your error

Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.

💬 What worked for others

No tips yet — did something else fix this for you?

Share what worked for you

Tips are checked by an editor before they appear. Links are removed.