Prevent cache in CloudFlare

Question

I'm getting started with CloudFlare and I’m using it to build a new project.

I’m facing an issue when I make changes: I cannot see my changes in the browser, so I assume the problem here is the cache setting of CloudFlare.

I have read this link, about the CloudFlare cache, so I put the following meta-tag in my html:

<meta http-equiv="Cache-control" content="private">

But the problem still remain.

Should I put other meta-tags, or prevent -somehow- caching from the server-side? (I'm using PHP)

Solution 1

cloudflare has a Development mode option that:

• Changes to cacheable content (like images, CSS, or JavaScript) will be visible immediately.
• CloudFlare's accelerated cache will be disabled.
• Development mode will automatically toggle off after 3 hours.
• If changes to your site are not immediate, press shift-reload.

You will also be able to turn off the Development mode at any time during the 3 hours.

Hope this helps with people looking for the same answer to this question or if you still have this issue.

Solution 2

This is very old question. To disable this we don't have to turn on development mode because cloudfare caches the CSS and JS. If you want to disable only the particular JS or CSS simply put following attribute to the link or script tag.

<script data-cfasync="false" src="/javascript.js"></script>

Solution 3

I just had to do this and it seems CloudFlare has updated their page rules. You can now create a page rule for a specific URL (and even use wildcards) then choose Cache Level > Bypass for the setting.

Solution 4

When I read you question it appears that you are (actually) wanting to specify caching rules in your code instead of directly on CloudFlare, I do this all the time.

This can be enabled globally or via a (targeted) page rule.

1. The global setting is located in Caching > Configuration > Browser Cache TTL > "Respect Existing Headers" (see screenshot)
2. The Page Rule setting will be in a rule attribute "Origin Cache Control = On"

View more solutions

Comments

[damoncloudflare]

Just clarifying in this post that we don't cache things like html or php by default, so we wouldn't impact this unless you set a PageRule to have us cache everything. We only cache static content by default & what we cache by default is here: support.cloudflare.com/hc/en-us/articles/… If you're making changes to the static content that we would cache, then you would want to either go to Development Mode or purge your cache.