How to set eTag header from jQuery?

Question

I am developing a Single page app, and I have a lot of requests to the server. There is one really big response(like 20-30 kb), and this response changes once every week, and I would like to cache the response in the browser based on an eTag. The ETag is set correctly from the server, but the browser doesn't send the eTag back on the next request.

Here is my server code :

public string GetActiveConfiguration()
    {
        var requestedETag = Request.Headers["If-None-Match"];
        var responseETag = layoutRepository.GetActiveConfigurationVersion().ToString();
        if (requestedETag == responseETag)
        {
            Response.StatusCode = 304;
            return "";
        }
        Response.Cache.SetCacheability(HttpCacheability.ServerAndPrivate);
        Response.Cache.SetETag(responseETag);
        return layoutRepository.GetActiveConfiguration();
    }

Here is my client code :

$.ajax({
            url: 'Admin/GetActiveConfiguration',
            type : 'GET',
            ifModified: true,
            success: function (data) {
                that.configuration = $.parseJSON(data);
                that.setRoles();
                that.setTitleAndIcon();
                that.initializeChat();
                callback();
                //that.loadViews(Object.keys(window.params)[0]);
            }
        });

Here is the server response :

Cache-Control:private Content-Encoding:gzip Content-Length:6544 Content-Type:text/html; charset=utf-8 Date:Tue, 13 May 2014 14:19:52 GMT ETag:13.05.2014 17:01:02 Server:Microsoft-IIS/8.0 Vary:Accept-Encoding X-AspNet-Version:4.0.30319 X-AspNetMvc-Version:4.0 X-Powered-By:ASP.NET X-SourceFiles:=?UTF-8?B?QzpcUHJvamVjdHNcZUNvbW1lcmNlXE1pY3JvaW52ZXN0IGVDb21tZXJjZSBQcm8gTmV3XE1pY3JvaW52ZXN0IGVDb21tZXJjZSBQcm8gTmV3XEFkbWluXEdldEFjdGl2ZUNvbmZpZ3VyYXRpb24=?=

Here is the next client request :

Accept:/ Accept-Encoding:gzip,deflate,sdch Accept-Language:en-GB,en;q=0.8 Cache-Control:no-cache Connection:keep-alive Cookie:I'llhideThoseOnPurpose:) Host:localhost:61061 Pragma:no-cache Referer:localhost User-Agent:Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.131 Safari/537.36 X-Requested-With:XMLHttpRequest

What am I doing wrong ?

Answer 1

Add this on the server side:

context.Response.Cache.VaryByHeaders["If-None-Match"] = true;

Reference: http://optimizeasp.net/conditional-get