The pictures display error after cache by Cloudflare

We have the following problem for displaying pictures at the sites:

The display of the small picture is OK. But we click the big picture, it will display the error (refer to the attached screen shots ) or refer to the following link:

We do not know if we enable WebP or not. Now, we disable the WebP.

Please advise us how we can recover these big pictures

Thanks!
David Ho


Could you please post the links to the images as `code`, and not as link?
Thanks

Ok, already got it.

Your problem is:

  1. MIME-Type (content-type) related
  2. having it’s root at your webserver config.

Working link: https://image.buyoyo.com/DVDshelf/Cover/avcable/506976-VDE.jpg

Broken link: https://image.buyoyo.com/DVDshelf/Cover/avcable/506976-VDE.JPG

The same link with a lowercase file extension does work, as the correct MIME-Type content-type: image/jpeg is set. But your instruction for your webserver does only apply the MIME-Type case sensitive to jpg, while it should not be case sensitive. Thats why no MIME-Type is set on the same URL with the upper-case file extension.

Please apply the correct MIME-Type (content-type: image/jpeg) not case sensitive to:

  • jpg
  • jpeg

or as regex:

  • jpe?g

And everything should work.

A quick workaround would be: changing the links in your DOM to lowercase file extensions.
In general all links and therefore also files and folders you serve in web should be lowercase. Thats best practice.

P.S.: this error pretty sure is not created by Cloudflare and WebP does not have anything to do with.

1 Like

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