NextJS + Sanity throws 500 error when loading images
Answered
Polish posted this in #help-forum
PolishOP
Hi everyone!
I have been working on a website that displays a ton of images from Sanity. I was using NextJS 14.2 version with Page Router, and everything worked fine. I just upgraded to version 15, and now some images throw error 500 and won't load. I don't understand what's the problem or how to fix it, and can't find the answer. Please help!
This happens both on my local host and on the deploy version, I am deploying with Vercel and I add a screenshot of the props I am passing on to the Image component.
Thank you very much!
I have been working on a website that displays a ton of images from Sanity. I was using NextJS 14.2 version with Page Router, and everything worked fine. I just upgraded to version 15, and now some images throw error 500 and won't load. I don't understand what's the problem or how to fix it, and can't find the answer. Please help!
This happens both on my local host and on the deploy version, I am deploying with Vercel and I add a screenshot of the props I am passing on to the Image component.
Thank you very much!
Answered by Anay-208
So @Polish I realised this was a timeout error.
So next/image was trying to fetch this image and to optimise it, however, it took too long to respond with the image.
It works normally when next/image is not used, because there is no timeout set there.
So its like a issue on sanity end, its taking time to deliver images
So next/image was trying to fetch this image and to optimise it, however, it took too long to respond with the image.
It works normally when next/image is not used, because there is no timeout set there.
So its like a issue on sanity end, its taking time to deliver images
10 Replies
what error do you see exactly
@Polish
Ping when you reply
Ping when you reply
PolishOP
On deploy: "error 500 A server error has occurred INTERNAL_UNEXPECTED_ERROR"
On localhost: "error 504 parameter is valid but upstream response timed out"
And it doesn't always happen with the same images
Thank you for answering @Anay-208!
On localhost: "error 504 parameter is valid but upstream response timed out"
And it doesn't always happen with the same images
Thank you for answering @Anay-208!
if you don't mind, can you send the image URI?
or upload a sample image and send its URI, I'll check
PolishOP
This one is the one that is failling rn on my local https://cdn.sanity.io/images/dhx2277a/production/01278afad80c629eb410910bbc603b0fab7caa2a-7559x6614.png
Sure, will check
So @Polish I realised this was a timeout error.
So next/image was trying to fetch this image and to optimise it, however, it took too long to respond with the image.
It works normally when next/image is not used, because there is no timeout set there.
So its like a issue on sanity end, its taking time to deliver images
So next/image was trying to fetch this image and to optimise it, however, it took too long to respond with the image.
It works normally when next/image is not used, because there is no timeout set there.
So its like a issue on sanity end, its taking time to deliver images
Answer
PolishOP
@Anay-208 oh okay, thank you very much for your help!!
can you mark solution