Mobile and Desktop Version Cache Error

[hassan_k52]

Hello;

I have two seperate versions one for Mobile and other one for Desktop. I have a cloudflare cache problem that when I open any product page from desktop then desktop version is cached onto cloudflare’s edge and when I open that product on mobile then it opens desktop version on Mobilephone.
And if I open any product in mobile which is not cached and neither opened in desktop then mobile version page is cached, If I open the same product page in desktop then mobile version page is opened.

How can I resolve this. Any help?

thank you

[sdayman]

This is one more reason why Caching dynamic content is a problem and isn’t generally offered by Cloudflare. If you’re using WordPress, APO has coded in Cache by Device. If not, then you’d have to code your own worker to do this…or upgrade to Enterprise for a ton of money.

[hassan_k52]

Thank you for your reply.

Yes I am using WordPress, Can you please tell me more about APO, Is this a plugin ?

[erictung]

@hassan_k52

APO, Is this a plugin ?

Yes. A plugin that can be installed in WordPress.

[sdayman]

https://support.cloudflare.com/hc/en-us/articles/360049822312-Understanding-Automatic-Platform-Optimization-APO-with-WordPress

[hassan_k52]

Thanks it was helpful.

I would like to work around with workers so I was going through the documentation of cloudflare worker all along. If I am unsuccessful then I will go with the APO plugin.

So I am new to this community, I apologize for my basic questions.
As I mentioned above I have been through Workers doc. I came across two APIs Cache API and Cache using Fetch. I can get the device type through “request.header.get” and then match it if its mobile else desktop.
As far as I have understood I must use Cache API for the above problem
If I am using cache API instead of this command

can I use this ?

because I want to cache everything. As written in the API cache key is only for Enterprise how can I achieve this in CF?

Thanks