Next Images do not load in Chrome

1

Hi, trying out Render for the first time with a Next.JS project. I’m seeing a weird issue on Chrome when using Next Image.

The images don’t load, but if I right-click the image select the “Load Image” option it loads the image and keeps the image between refreshes. Looking at the HTML, this seems to be specifically related to the img srcset. If I right-click+open one of the srcset URLs, it goes to an /_ipx/ URL (this /_ipx/ URL is not the URL in the srcset, it’s a redirect or something). The fallback image URL does not seem to be impacted, if I open that URL it works just fine.

You can view the site here to see what I mean: https://harvesta.io (ignore the hero image, it uses an SVG)

This doesn’t happen on Netlify and Vercel, and it only happens with Render when viewing the page in Chrome. It shows the image fine in Firefox. It impacts both Chrome desktop and mobile. Very strange.

Any ideas?

Specs:
Next version: “latest”
Node version: “>=16”
Build command: “yarn; yarn build”
Run command: “yarn start”
Render Plan: “starter”

2

Update - not sure how to delete the post. But, I’ve since switch to AWS Amplify. Primary reason being CloudFront Next.JS setup looked like a pain and Amplify does that setup for you. Still like Render though and will try out on other projects.
As for the image load issue. I uploaded the same repo to a subdomain and Chrome did not have this issue. So, at some point between hosting on Netlify and hosting on Render, caching broke with Chrome. I’d assume with time it would’ve probably fixed itself.

3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.