"url" parameter is valid but upstream response is invalid 에러

Nextjs에서 제공하는 Image 태그를 사용하려하니 엑박이미지와 함께 "url" parameter is valid but upstream response is invalid 에러메시지가 표시됬다.

엑박이미지

하지만 img태그는 정상작동한다.. 뭐지?(200이고 클라이언트, 서버둘다 문제가 없어보임)

 

next.config.js에서 도메인 설정은 잘되어있다.

  images: {
    formats: ['image/avif', 'image/webp'],
    remotePatterns: [
      {
        hostname: 'www.....com',
      },
      {
        hostname: '...cloudfront.net',
      },
    ],
  },

 

아래 깃헙 이슈에는 4.0버전에서부터 안된다고하는 유저가있는데 내 버전은 14.1.4이다..

Nextjs에서 현재까지 해당부분이 고쳐지지않았거나 url이 Nextjs와 호환(?)이 잘안된것으로 파악됨.

 

일단은 해당 문제 이미지들(특정 호스트네임)만 img태그로 대체하여 임시 해결하였다.

 

https://github.com/vercel/next.js/issues/53715

next/image "url" parameter is valid but upstream response is invalid · Issue #53715 · vercel/next.js

https://nomadcoders.co/community/thread/5537

나와 같은 문제를 겪고있는 사람

[Next.js] fetch 해온 Image 가 오류가 발생하고 업로드되질 않습니다 ㅠ – 노마드 코더 Nomad Coders