Some images don't load the background

[AllenEllis]

Example:

I haven't really looked into the cause of this. The best way is to look at the HTML file that's been generated. In this case, the PNG is at
https://everysinglemonth.org/exports/png/16000US0629000_7a402b.png
So the corresponding HTML is at
https://everysinglemonth.org/exports/html/16000US0629000_7a402b.html

Loading that HTML page, I see one error in the console, which is potentially the issue:
Cross-Origin Read Blocking (CORB) blocked cross-origin response https://www.icloud.com/photos/ with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details.

Maybe it's because the image it refers to (https://share.icloud.com/photos/0X6Kx7sZNh9CKbneiVI_yIfiQ) is not really an image, it's a web page.

Searching for that same city on ESM, I don't even see how they found that particular image. So this could use some more digging around.

[axelson]

Maybe they used the "Or, specify your own image:" feature?

[AllenEllis]

Here's another one that just got saved with an invalid background
https://everysinglemonth.org/exports/png/16000US0465000_7b4b04.png
https://everysinglemonth.org/exports/html/16000US0465000_7b4b04.html

The broken background image in the HTML is
https://img.travelawaits.com/filter:centercrop/quill/d/5/9/a/c/a/d59aca4e977c4d82ae801020c08dfd58bad3325e.jpg?w=800, which is not a valid image

And the closest match when searching "Scottsdale" is thumbnail option 5, which should be
https://img.travelawaits.com/filter:centercrop/quill/d/5/9/a/c/a/d59aca4e977c4d82ae801020c08dfd58bad3325e.jpg?w=800&h=800

So it would seem some part of my code is stripping out the &h=800 from the end.

I won't have a chance to look any further into this today, I'm happy for someone else to poke around and reccomend a fix 👍 🙂

Edit: Here's another example: https://everysinglemonth.org/exports/html/16000US0672016_b55dfa.html