Unfortunately doesn't work well with Netlify #1
Comments
|
Hi, thanks for the issue 😃 I took a look at the link you provided, and the link from penult commit and it looks like everything works & loads well on the desktop and when I tried scaling down the resolution to mobile, then it started to crash
but not sure if it is a problem with the library or Netlify internals (I am not very familiar with Netlify), because some people experience similar issues here netlify/next-runtime#1220 (comment)
|
|
Sometimes it the images are loaded correctly on this deploy https://deploy-preview-22--portfolio-lea.netlify.app/. But sometimes they don't load and the log can be seen in the dev tools console. After refreshing it typically does load the images correctly. I also suspect this has something to do with Netlify's implementation of the Api routes in Next.js. Thanks for the linking of the netlify-plugin-next issue maybe a solution will pop up there. Once again amazing work on this though! |
|
The Netlify error appears to be because the source image isn't sending a content-type header. The IPX handler is checking to see if it's an image before trying to resize it, but as the header is msising it's throwing the error. It could in theory be changed to allow missing headers. |
|
Hey @ascorbic, nice to see you here too :). Could this explain why it's only failing sometimes? Would the headers only be sent sometimes? What could be done to fix the issue? |
|
I'm not sure. The fix would be to make it fail more gracefully on missing headers. A PR would be welcome for that |
|
Hi @alianza, were you able to resolve this issue, or is it still happening? |
|
Hey @bmstefanski, I resorted to not using this package for externally sourced images. So now I'm not having any issues, but I can't use the Next.js Image component. As far as I know the same issue still persists. |
|
Thanks for the reply. I cannot commit to fixing it right now, so will leave the issue open and will add a note about the limitation to the readme |
First of all amazing workaround for a stupid shortcoming of the Next.js Image component. Though unfortunately this solution doesn't properly work on Netlify. I also needed to use Medium.com images reliably. I didn't even have to change your example regex :)
Builds logs (or link to your logs)
Netlify Build logs
Using @netlify/plugin-nextjs@4.2.7
See this branch deployment of this commit: https://github.com/alianza/portfolio-lea/tree/f1bb1249c5a08d372810c4a467f74779dd7c708c
https://6228fd5efb25a900089c73dd--portfolio-lea.netlify.app/ (Sometimes the images of articles fail to load (Medium.com))
Following error in dev tools console as well:
GET https://leashamaa.nl/_ipx/w_640,q_75/%2Fapi%2FimageProxy%3FimageUrl%3Dhttps%3A%2F%2Fcdn-images-1.medium.com%2Fmax%2F1024%2F1%2AMQIsvhUnGoPahH4-OGTkyA.jpeg?url=%2Fapi%2FimageProxy%3FimageUrl%3Dhttps%3A%2F%2Fcdn-images-1.medium.com%2Fmax%2F1024%2F1*MQIsvhUnGoPahH4-OGTkyA.jpeg&w=640&q=75 502The text was updated successfully, but these errors were encountered: