When you use CloudFlare as your website CDN server, you always need to know whether the web page is cached by CloudFlare or not. And CloudFlare return some http response headers when you request the web page, you can get the web page cached status from those response headers.
One of the response header is Cf-Cache-Status, this header’s value shows whether the web page is cached by CloudFlare or not. The header value can be DYNAMIC or HIT. This article will tell you how to change the response header Cf-Cache-Status‘s value from DYNAMIC to HIT.
1. How To Inspect Http Response Header Cf-Cache-Status’s Value.
- You can use google chrome inspector to get current web page response header’s value.
- Just open your web page in google chrome, right click the web page area, then click Inspect menu item in the popup menu list.
- Click Network tab in the inspector window, and reload the web page again.
- Click resource name in left, click Headers tab in right panel, then you can see the resource request and response headers list like below picture.
- You can read article How To View HTTP Headers, Cookies In Google Chrome, Firefox, Internet Explorer for more detail.
2. What Dose Cf-Cache-Status Header’s Value Means.
Below is the Cf-Cache-Status Header’s Value list.
- HIT : The web resource ( html page, image, js etc) has been cached in CloudFlare server and not expired. It is returned from the cache.
- MISS : The web resource has not been found in CloudFlare cache, CloudFlare get the resource from your original web server, put it in CloudFlare cache and return it to web browser.
- EXPIRED : The cached web resource has expired, so CloudFlare will retrieve this web resource from your original web server again, put in it CloudFlare cache and return it to web browser.
- BYPASS : Thw returned web resource is not cached and will not be cached, it is retrieved from original web server directly.
- DYNAMIC : The web resource is returned from original web server, it is not cached by CloudFlare by default. But you can configure CloudFlare to cache such web resources, then in the future request, the web resource will be cached.
3. Inspect Web Resource Response Header Cf-Cache-Status Value.
- By default, CloudFlare will not cache html web page.
- So when you inspect web page follow section 1’s steps, you will find response header like cf-cache-status: DYNAMIC.
- But when you inspect other web resources ( for example js, image files etc), the response header may be cf-cache-status: HIT or cf-cache-status: MISS etc. This is because CloudFlare will cache such web resources by default.
4. How To Configure CloudFlare Page Rule To Change Web Page Response Header Cf-Cache-Status’s Value From DYNAMIC to HIT.
What you need to do is just add a page rule in CloudFlare settings to make your web page being cached by CloudFlare.
- Login to your CloudFlare management dashboard.
- Click Page Rules icon at page top area.
- Click Create Page Rule button.
- Input a url path in the top input text box, you can use * in the url path.
- Select Cache Level in Pick a Setting drop down list.
- Select Cache Everything in Select Cache Level drop down list.
- You can select page rule trigger order in the Order selection list.
- If there are multiple page rules, the most top page rule in the page rule list will be triggered first.
- Now when you browse the html page in the page rule url path, you will find the response Cf-Cache-Status header’s value will change to HIT or MISS.