Cloudflare cache (I believe) causing "per user" issues with broken javascript
I have a Rails app.
When we produce and push a new version, it expires the previous version of the JS assets. In our deployment process, we call the cache clear API endpoint from Cloudflare. We do this immediately on the deploy.
But, the browser, through Cloudflare, we still seems to have the issue that a user's browser will become busted, and all JS won't work. We start getting this error in the browser console:
https://cln.sh/ZjmTG6JQ
If I go into the app as the user itself, call the Cloudflare API cache and clear it again, and then hard reset the cache in the browser (Shift+ctrl+r), the app JS will refresh and start working.
Note that other users may or may not be experiencing this problem.
Note that going into "incognito mode" doesn't fix that same browser. Going from Chrome to Safari the problem remains. But, going to Firefox, that browser will work.
It seems like it's keeping track of the broad browser type, and caching assets for that user. But, this breaks our app. As an admin, i can hit the Cloudflare API endpoint and fix. But the user experience for our end users is abysmal.
We've been assuming this is our problem, and trying patch after patch to fix it for months.
What else can I do? It's getting to the point we need to abandon Cloudflare.
14 Replies
I'll add a bit of color. We use Cloudflare to host the certificate, and this is integrated into our Kubernetes flow. Its a huge pain to move it. But, we're at a loss as to how to solve it.
Do the updated assets have unique paths?
Are they served with Etags?
Yes, they do.. each asset has a new version number.
In the screenshot above, is it requesting an old version of the JS, or the new one?
but i'm not sure if the HTML is being cached as the previous version..
Ooh, that might be it. Is the HTML Etagged?
So, looking at it.. the javascript filename seems to have the same name.
but clearing the cache seems to make it work.
i just double checked.
so, its that the html is good, but it can't access that resource until we clear the cloudflare cache.. which is weird.
Yeah, that sounds then like some things are using the new assets, while others are using the old, which definitely can break stuff. I would recommend setting cache headers that are really low, but allow for revalidation from the origin
can you point me at a link for a description of what you're suggesting?
the TTL is set to 2 minutes already.
MDN Web Docs
HTTP caching - HTTP | MDN
The HTTP cache stores a response associated with a request and reuses the stored response for subsequent requests.
are you using capistrano ?
you can add a task to clear the cf cache. we do that with our app
I'm using Github.. after we build the docker container and we push, we call the Cloudflare API to clear the cache. We added this, and it didn't help, but we've left it. it might happen too quickly. I'm not sure.
Right now, I just turned off all caching in production in Rails. I'm redploying right now, and we'll see if that improves things.
sorry, "github" - we run tests and build a docker container, then it publishes it which triggers awebhook that deploys a new version on Kubernetes. So, no, no capistrano.
we had similar problem of stale cache. but we had a vm.
good luck
@hhf thanks!