Detect device in varnish and no cache - ios

Question

I have an ipad app which shows a few of my wordpress posts.the site has varnish enabled.i send a custom http.User-Agent for app pages so that a few of the desktop contents does not show in app like header and footer because my app has both.
So what happens is when a user visits through desktop then it is cached in varnish and when another user checks the same page using app he is getting the desktop version.
I tried below in my default vcl.
### do not cache these files:
##never cache the admin pages, or the server-status page
if (req.url ~ "wp-(admin|login)" || req.http.Content-Type ~ "multipart/form-data" || req.http.User-Agent ~ "IPAD_APP" )
{
set req.backend_hint = master;
return(pass);
}
IPAD_APP is my custom agent
this did not help.May I know weather this is correct aor is there any other aproach to display different content for desktop and app version.

Answer 1

The direct problem you are having is that the desktop version is cached, so that's what the mobile people will see. You can update the vcl_hash function to take into account whether it is the desktop or iPad (or any number of different device types might have).
One option:
sub vcl_recv {
set req.http.X-DeviceType = "desktop";
if (req.http.User-Agent ~ "IPAD_APP") {
set req.http.X-DeviceType = "ipad_app";
}
}
sub vcl_hash {
hash_data(req.http.X-DeviceType);
}
This ends up being a light version of sending a "Vary: User-Agent" from the origin Wordpress. The problem with the approach I've outlined is that in order to do a PURGE you would need to ensure that you pass each User-Agent in turn. If you are sending low-ish TTLs on your cache, then that won't be a problem however. A BAN will solve that as well.