Http headers max-age not caching when vary accept-encoding

Question

I'm trying to make a static files to be cached in the browser for a small amount of time (10 sec). It seems to be working properly when refreshing page. - 200 if you are new - 200 served from cache if you soft-refresh during the first 10 sec - 304 if you come after more than 10 seconds.

Whenever I add the Http header 'Vary': 'Accept-Encoding' it stops working, meaning that browser cache does not work any more (I always hit the server). This happens because the Http request stop sending if-modified-since or if-none-match whenever I add the Http header 'Vary'.

Are cache-control and vary compatible working together?

I leave the Http Request and Response in case someone can suggest some solution:

Request Header
accept:*/*
accept-encoding:gzip, deflate, sdch
accept-language:en-US,en;q=0.8
cache-control:max-age=0
cookie:XXXXX
referer:XXXXXXXXX
user-agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.75 Safari/537.36


Response Header
cache-control:max-age=10
content-encoding:gzip
content-type:application/javascript
date:Wed, 13 Apr 2016 12:34:57 GMT
etag:W/"XXXXXXXXXXXXXX"
last-modified:Wed, 13 Apr 2016 12:34:25 GMT
server:nginx/1.9.14
status:200

vary:Accept-Encoding

x-powered-by:Express

In Express I have this configuration to set response headers for static files:

var setHeaders = function(res, path)
{
  res.setHeader('Cache-Control', 'max-age=10'); 
  res.vary('Accept-Encoding');
};

app.use('/static', express.static('./app/static', {setHeaders: setHeaders}));

Answer 1

I had a self certificate issue. It seems that it was causing the issue. Without the header vary everything seems to be working properly even if the certificate was not installed. Despite of that, when using the vary header issues were showing up for the cache.

Installing the self certificate made it work.

Solution came from: Why browser does not send "If-None-Match" header?