Cache isn’t clearing on mobile devices so mobile viewers are seeing outdated content (Wordpress). The cache clears every 4 hours on desktop, but mobile recently showed the same outdated content for 1 month, until I went in and manually cleared it by clicking on “Purge Everything”. How can I make mobile devices clear regularly just like desktop browsers do?
I did just notice that the Cloudflare plugin was no longer logged in for some reason, so I just reconnected it and switched on “Apply Recommended Cloudflare Settings for Wordpress” and “Automatic Platform Optimization” and I checked the box “Cache by Device Type”. Will this fix it?
I am also using the Clouldflare plugin Version 4.12.2 and am also using Autoptimize plugin.
Is your website responsive, that is, the same content is returned to both desktop, tablet and mobile? If not, what kind of change is there (in the path or query string or header etc.) that identifies mobile vs non-mobile request?
This option only makes sense if your website is not responsive, or you send different content to mobile, otherwise don’t use it. APO with Cache by Device Type will send to the origin a request header identifying the request as either desktop, mobile or tablet. Origin must use that to return the the specific content to each. You need to make sure your theme and/or cache/optimization plugin will handle that well. Some won’t, you need to test.
Oh okay, thank you. Our website is responsive, and the mobile content is the same thing as desktop, so I will uncheck this.
So I’m still not sure how to make mobile phones show the latest content. Desktop browsers seem to refresh a couple times per day. But my mobile phone, even with clearing my browser history, showed content a month old on it. I tested Safari and Chrome on my iPhone.
Does your installation send different Cache-Control values for desktop and mobile? APO cannot control how browsers cache behave. If you’re seeing browsers caching content and not refreshing it, that means these browsers never requested the new content from Cloudflare as it’s cached on the device. You need to check your HTML pages for the Cache-Control header, which tell browsers what and how to cache, then change the values according to your needs.
Cache-Control header will be ignored by APO, but not by browsers, so it should have a low value in seconds for it’s “max-age” directive as a way to force browsers to revisit the website after expiration. There’s no magic formula for a good amount of time, though I wouldn’t set it higher than a day (86400 seconds), and it could be much lower depending on how often you update content, and how long a delay in refreshing content is tolerable as a price to pay for efficiency.
If you want all pages to revalidate with Cloudflare edge at every request, you could set it as:
Cache-Control: max-age=0, must-revalidate
That will let the browser cache, but force it to revalidate at every request. Since Cloudflare edge is very close to visitors, this shouldn’t add more than ~200 ms to the time it takes the page to load, and should result in fresh content all the time.
As for the devices that have already cached HTML content with a long max-age setting, there’s no way to force them to purge the cache and refresh, you’d need to wait time to take its course.
I’m afraid you need first to familiarize yourself with how Cache works, both in Cloudflare and in websites in general. If you set the wrong cache directives, you could mess with your website in unknown ways, and unless you fully grasp the concepts involved in caching at the origin and at a proxy like Cloudflare, only a developer with knowledge of your installation would be able to properly assist you.
It takes dozens of developers to create a WordPress site. You should seek their assistance by visiting the relevant support forums for your theme and whatever optimization and caching plugins you may have installed.