How to get Cloudflare to cache HTML

To my surprise, if you setup a Cloudflare caching proxy in front of a website it won't cache HTML pages by default, even if they are served with cache-control: headers.

This is documented here:

Cloudflare does not cache HTML resources automatically. This prevents us from unintentionally caching pages that often contain dynamic elements.

I figured out how to get caching to work using a "Cache Rule". Here's the rule I added:

I've told it that for any incoming request with a hostname containing .datasette.site (see background in my weeknotes) it should consider that page eligible for caching, and it should respect the cache-control header.

With this configuration in place, my backend can now serve headers that look like this:

cache-control: s-maxage=15

This will cause Cloudflare to cache the page for 15 seconds.

I tried to figure out a rule that would serve all requests no matter what they looked like, but the interface would not let me leave the rules blank - so hostname contains .datasette.site was the best I could figure out.

Related

• cloudflare Cloudflare redirect rules with dynamic expressions - 2024-05-29
• http Testing the Access-Control-Max-Age CORS header - 2023-05-25
• github Setting up a custom subdomain for a GitHub Pages site - 2022-05-04
• cloudflare Adding a robots.txt using Cloudflare workers - 2021-12-21
• cloudflare Redirecting a whole domain with Cloudflare - 2024-03-15
• readthedocs Pointing a custom subdomain at Read the Docs - 2020-08-14
• azure Writing an Azure Function that serves all traffic to a subdomain - 2021-03-27
• aws Adding a CORS policy to an S3 bucket - 2022-01-04
• fly Assigning a custom subdomain to a Fly app - 2021-11-20
• nginx Using nginx to proxy to a Unix domain socket - 2021-07-10

Created 2024-01-08T20:21:07-08:00 · Edit