Images hosted from self-hosted blog fail to load

The images inside my posts fail to load from the micro.blog CDN. The images show correctly on my site, and in mastodon syndication. I followed the HTML output from Manton’s site, and note sure what I’m doing wrong.

Thanks in advance!

Resources

What happens if you make a post with an image hosted elsewhere? For example https://placekitten.com/g/800/600?

When Micro.blog’s photo cache tries to download your image, it’s taking too long and timing out. Is it possible that there is something on your server that is blocking the requests from Micro.blog?

Hm interesting. There’s no server configurations specifically blocking micro.blog, and there’s no content security policy set on static assets.

curling this image produces this output:

server: nginx
date: Tue, 21 Feb 2023 15:37:56 GMT
content-type: image/png
content-length: 543077
last-modified: Sat, 18 Feb 2023 17:52:18 GMT
etag: "63f11052-84965"
expires: Wed, 21 Feb 2024 15:37:56 GMT
cache-control: max-age=31536000
pragma: public
cache-control: public, max-age=31536000, immutable
x-content-type-options: nosniff
accept-ranges: bytes

Could it be that I’m serving responsive images? Here’s some sample markup.

<img
  src="https://www.chrisdeluca.me/note/performing-the-cats-cradle/cats-cradle-show-1_hu3dcf2f4a2f767ae0909f9f0d706036e4_130849_600x0_resize_box.png" 
  width="600"
  height="432"
  srcset="https://www.chrisdeluca.me/note/performing-the-cats-cradle/cats-cradle-show-1_hu3dcf2f4a2f767ae0909f9f0d706036e4_130849_900x0_resize_box.png 900w, https://www.chrisdeluca.me/note/performing-the-cats-cradle/cats-cradle-show-1_hu3dcf2f4a2f767ae0909f9f0d706036e4_130849_1200x0_resize_box.png 1200w"
  sizes="(min-width: 472em) 600px, 93vw"
  alt=""
/>

No, that’s not it, Micro.blog finds your image URL:s okay. Take this post, for example. Inspecting that page, we find Micro.blog is embedding the image with this URL:

https://cdn.micro.blog/photos/1000x/https%3A%2F%2Fwww.chrisdeluca.me%2Fnote%2Fperforming-the-cats-cradle%2Fcats-cradle-show-1_hu3dcf2f4a2f767ae0909f9f0d706036e4_130849_600x0_resize_box.png

That URL is not working because of the timeout issue Manton explained above. The original URL works fine when I fetch it from my machine:

time curl -I https://www.chrisdeluca.me/note/performing-the-cats-cradle/cats-cradle-show-1_hu3dcf2f4a2f767ae0909f9f0d706036e4_130849_600x0_resize_box.png
HTTP/2 200 
server: nginx
date: Thu, 06 Apr 2023 06:13:25 GMT
content-type: image/png
content-length: 315338
last-modified: Sun, 02 Apr 2023 02:46:20 GMT
etag: "6428ec7c-4cfca"
expires: Fri, 05 Apr 2024 06:13:25 GMT
cache-control: max-age=31536000
pragma: public
cache-control: public, max-age=31536000, immutable
x-content-type-options: nosniff
accept-ranges: bytes


real	0m2.156s
user	0m0.026s
sys	0m0.013s

It’s not super fast, but it works. So the next step is to figure out why it times out when Manton’s servers (or Amazon’s, I guess) fetches that URL. For that, you need to take a look at your server logs. Find the request that fails and continue the investigation from there. I can imagine the following scenarios:

  1. Your server successfully serves the images, but it is too slow for Amazon’s taste, so you have to serve it faster.
  2. Your server fails to serve the image for one reason or the other, you have to figure out why and fix the problem.
  3. Your server serves the images swiftly and successfully. In that case, the timeout Manton is talking about might happen for another reason. Maybe it’s not a network timeout but an image processing timeout, for example. In that case, Manton might have to adjust something at the CDN level.

Taking a look at your server logs will hopefully make it clear which scenario it is.

By the way, I should have mentioned that Micro.blog’s photo caching has a fairly low timeout: 10 seconds. And then Amazon’s CDN is on top of that and might have its own limits.

Not sure if it helps, but I’m also having the same issue on my personal blog hosted on Micro.blog. I emailed support with more details about the issue but from what @chrisd describes is the same pattern of behaviour, images failed to load from CDN.