Next.JS Images error: Failed to load, status 500 (ipx TypeError in edge function logs)

Support
1

My Next.JS site images often fail to load (seems to be intermittent), with a status 500 error. There are some similar open topics/threads around, but they appear to be caused by unrelated factors, such as local builds etc.

Additional Info:

  • Built/Deployed with Netlify from linked Github repo
  • Images from Sanity
  • Next 12.2.3
  • Next.JS runtime 4.14.2

Example

Deploy Preview

Edge Function Log Message Example (with image path removed)

2:56:04 PM: [ipx] TypeError: error sending request for url (https://deploy-preview-15--rvgmiller.netlify.app/_ipx/***IMAGEPATH***): connection error: broken pipe
    at async mainFetch (deno:ext/fetch/26_fetch.js:287:14)
    at async fetch (deno:ext/fetch/26_fetch.js:501:9)
    at async FunctionChain.fetchOrigin (file:///root/src/bootstrap/function_chain.ts:47:21)
    at async FunctionChain.runFunction (file:///root/src/bootstrap/function_chain.ts:132:30)
    at async FunctionChain.run (file:///root/src/bootstrap/function_chain.ts:117:26)
    at async handleRequest (file:///root/src/bootstrap/handler.ts:27:26)
    at async Server.#respond (https://deno.land/std@0.136.0/http/server.ts:220:24)

Any help/insight would be appreciated.

2

This error occurs on all asset paths fetched with netlify-edge-functions (html, js, json…). It is totally random and not reproducable. It is likely a problem with the deno infrastructure as metioned here: Deno Task start fails when NPM registry can't be found - PullAnswer

1 Like
3

Ah that’s concerning. It appears to be happening quite often, so I might need to deploy elsewhere, at least until it’s resolved.

Cheers!

4

Hey there, @rvgmiller :wave:

Can you please share your Netlify site name as well as your repository? If you cannot share your repository, your netlify.toml as well as the folder with your images would be beneficial. I will bring this to our team to investigate further for you!

1 Like
5

Hi @hillary
Thanks, the site name is: rvgmiller
The repo is private and the images are coming from Sanity. Also, I’m not using a netlify.toml for this site.

8

Hey there, @rvgmiller :wave:

thanks! I have shared the relevant information with our team, and we have an open issue investigating. I will follow up here once we have additional details. Thanks!

11

Good news, I believe that our dev team rolled out a fix about 13 hours ago. Would you let us know if you see any further occurrences, please, @rvgmiller ?

13

Thanks @fool , but unfortunately it is still happening. I have taken a quick look and noticed ERROR Task timed out after 10.03 seconds in the _IPX Function Log. I’m unsure if this is the same issue as before, or something new.

On a side note - I have been seeing some noticeable general latency, including initial server responses regularly over 3 seconds. Is that in any way related?

14

The issue you’re seeing now is un-related to the above thread. To solve this:

  1. Either disable AVIF or WebP as they’re resource-hungry transforms and can take long.
  2. Try to keep the source image in the minimum possible size. For example, if you need a 1000px image, keeping a 5000px source image is not a good idea as it will take time to process.
  3. On Pro and above plans, we can raise the limit to 26 seconds, however that would also mean that it would take up to 26 seconds for each image to load.

The general latency might or might not be related to this. To confirm, we’d need a HAR file recording,

15

Thanks @hrishikesh, I’ll look into this on my end. Marking as solved :+1: