I have my origin server responding to requests with these cache headers:
'Surrogate-Control' : 'max-age=86400, stale-while-revalidate=1800, stale-if-error=86400' 'Cache-Control' : 'max-age=30'
I want Fastly to cache the content for a day, while the browser will only cache the content for 30 seconds. This works for the first thirty seconds, but afterwards the browser will request the content every time (receiving a 304, since the content has actually not changed). I’d like for the browser to receive that 304 and then load the content from the cache for the next 30 seconds. Then receive another 304 and load from cache and so on (until the content actually has changed or the content goes stale in Fastly).
First response looks like this (some headers omitted for brevity):
The second request made less than 30 seconds later results in the content being loaded from cache.
The third request made more than 30 seconds later results in a 304:
HTTP/1.1 304 Not Modified Date: Mon, 17 Jul 2017 19:20:23 GMT Via: 1.1 varnish Cache-Control: max-age=30 ETag: W/"140fa6-gG4hMYN4QxLRultLws1I3EqDVVE" Age: 321
The fourth request made right afterwards still results in a 304 instead of content being read from browser cache:
HTTP/1.1 304 Not Modified Date: Mon, 17 Jul 2017 19:20:33 GMT Via: 1.1 varnish Cache-Control: max-age=30 ETag: W/"140fa6-gG4hMYN4QxLRultLws1I3EqDVVE" Age: 331
I’m assuming this is because the
Age header is more than 30. Do I need to configure Fastly to send a different Age header so the
Cache-Control: max-age=30 header is respected for the browser’s cache?