Link to the code that reproduces this issue
https://stackblitz.com/edit/nextjs-14-2-7-image-bug?file=app%2Fpage.tsx
To Reproduce
- Download the sandbox - https://stackblitz.com/edit/nextjs-14-2-7-image-bug?file=app%2Fpage.tsx
npm install && npm run dev
- Open http://localhost:3000
- Observe the broken image
Current vs. Expected behavior
Image optimizer in v14.2.7 rejects image requests for remote images that contain _next/image in the URL path.
Scenario:
- Next.js app uses images coming from external CMS (the images are hosted on 3rd-party domains)
- Some of the remote images just happen to be sourced from 3rd-party domains that also use Next.js and thus contain
_next/image in their URL path
- Starting with v14.2.7 image optimizer rejects image requests for such remote images
As far as I can tell, this change comes from #68628
While I understand the need to avoid recursive image optimizer calls within the same app, the current implementation seems overly restrictive. Image optimizer should not reject requests for remote images specified in the remotePatterns as the app doesn't have control over what images are coming from an external CMS.
Provide environment information
Operating System:
Platform: darwin
Arch: x64
Version: Darwin Kernel Version 23.5.0: Wed May 1 20:09:52 PDT 2024; root:xnu-10063.121.3~5/RELEASE_X86_64
Available memory (MB): 32768
Available CPU cores: 12
Binaries:
Node: 20.16.0
npm: 10.8.1
Yarn: N/A
pnpm: N/A
Relevant Packages:
next: 14.2.7 // Latest available version is detected (14.2.7).
eslint-config-next: N/A
react: 18.3.1
react-dom: 18.3.1
typescript: 5.5.4
Next.js Config:
output: N/A
Which area(s) are affected? (Select all that apply)
Image (next/image)
Which stage(s) are affected? (Select all that apply)
next dev (local), next start (local)
Additional context
No response
Link to the code that reproduces this issue
https://stackblitz.com/edit/nextjs-14-2-7-image-bug?file=app%2Fpage.tsx
To Reproduce
npm install && npm run devCurrent vs. Expected behavior
Image optimizer in v14.2.7 rejects image requests for remote images that contain
_next/imagein the URL path.Scenario:
_next/imagein their URL pathAs far as I can tell, this change comes from #68628
While I understand the need to avoid recursive image optimizer calls within the same app, the current implementation seems overly restrictive. Image optimizer should not reject requests for remote images specified in the
remotePatternsas the app doesn't have control over what images are coming from an external CMS.Provide environment information
Operating System: Platform: darwin Arch: x64 Version: Darwin Kernel Version 23.5.0: Wed May 1 20:09:52 PDT 2024; root:xnu-10063.121.3~5/RELEASE_X86_64 Available memory (MB): 32768 Available CPU cores: 12 Binaries: Node: 20.16.0 npm: 10.8.1 Yarn: N/A pnpm: N/A Relevant Packages: next: 14.2.7 // Latest available version is detected (14.2.7). eslint-config-next: N/A react: 18.3.1 react-dom: 18.3.1 typescript: 5.5.4 Next.js Config: output: N/AWhich area(s) are affected? (Select all that apply)
Image (next/image)
Which stage(s) are affected? (Select all that apply)
next dev (local), next start (local)
Additional context
No response