Troubleshooting Cloudflare Cache Issues: Why Static JS Files Always Show CF-Cache-Status: MISS


2 views

When examining the response headers for lifeinuk.js, we notice several important caching headers are properly set:

Cache-Control: public, max-age=1382400
Last-Modified: Fri, 09 Jan 2015 10:06:21 GMT
ETag: W/"507660-1420797981000"

These headers suggest the file should be cacheable, yet Cloudflare continues to report CF-Cache-Status: MISS on subsequent requests.

Here are the most common reasons for Cloudflare not caching static files:

1. Query Strings in URLs

Cloudflare treats URLs with query strings as unique resources. Check if your requests include any parameters:

http://www.testlifeinuk.com/dist/lifeinuk.js?version=1.0

Solution: Either remove query strings or enable "Ignore Query String" in Cloudflare's Cache Settings.

2. Missing or Invalid Cache-Control Headers

While your headers appear correct, verify they're being set properly by your origin server. Here's how to properly set them in Express:

app.use('/dist', express.static('public/dist', {
  maxAge: '16d',
  etag: true,
  lastModified: true
}));

3. Browser Cache Interference

Test with curl using -H "Cache-Control: no-cache" to bypass local caching:

curl -I -H "Cache-Control: no-cache" http://www.testlifeinuk.com/dist/lifeinuk.js

For deeper investigation, try these approaches:

Using Cloudflare's Cache API

Purge and check cache status programmatically:

# Purge cache
curl -X POST "https://api.cloudflare.com/client/v4/zones/{zone_id}/purge_cache" \
-H "X-Auth-Email: user@example.com" \
-H "X-Auth-Key: {global_api_key}" \
-H "Content-Type: application/json" \
--data '{"files":["http://www.testlifeinuk.com/dist/lifeinuk.js"]}'

# Check cache status
curl -X GET "https://api.cloudflare.com/client/v4/zones/{zone_id}/cache/variants" \
-H "X-Auth-Email: user@example.com" \
-H "X-Auth-Key: {global_api_key}"

Edge Side Includes (ESI) Considerations

If using ESI, ensure proper configuration:

# In your Cloudflare Worker
addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

async function handleRequest(request) {
  let response = await fetch(request)
  response = new Response(response.body, response)
  response.headers.set('Cache-Control', 'public, max-age=86400')
  return response
}

After implementing changes, verify with:

curl -I http://www.testlifeinuk.com/dist/lifeinuk.js | grep -i "CF-Cache-Status"

You should see CF-Cache-Status: HIT for subsequent requests if caching is working properly.


When testing caching behavior for static JavaScript files through Cloudflare, I noticed persistent CF-Cache-Status: MISS headers even after multiple identical requests. Here's the full header analysis from my test case:

HTTP/1.1 200 OK
Date: Mon, 12 Jan 2015 10:59:21 GMT
Content-Type: application/javascript
Cache-Control: public, max-age=1382400
Last-Modified: Fri, 09 Jan 2015 10:06:21 GMT
CF-Cache-Status: MISS

Several factors could prevent Cloudflare from caching static content:

  • Query strings in URLs: Cloudflare treats file.js?param=1 as different from file.js
  • Cookie presence: Requests with cookies often bypass cache
  • Dynamic headers: Vary headers that are too broad

Despite having proper caching headers:

Cache-Control: public, max-age=1382400
Last-Modified: Fri, 09 Jan 2015 10:06:21 GMT
Expires: Wed, 28 Jan 2015 10:59:21 GMT

Cloudflare still wasn't caching the file. The smoking gun appeared in the response headers:

Set-Cookie: __cfduid=d11a9f01292153436a211a9d807a3399b1421060361
Vary: Accept-Encoding

Here's how to verify caching behavior using curl:

# First request (should be MISS)
curl -I http://example.com/file.js

# Subsequent requests (should be HIT if caching works)
curl -I http://example.com/file.js

# Test without cookies
curl -I --cookie "" http://example.com/file.js

After testing these solutions, the caching started working:

  1. Page Rule: Created a rule to "Cache Everything" for *.js paths
  2. Cookie Handling: Modified application to not set cookies for static assets
  3. Cache Level: Set to "Aggressive" in Cloudflare's Caching configuration

After implementing these changes, subsequent requests showed:

CF-Cache-Status: HIT
Age: 120