Disable cache on mobiles

Question

I'm creating an asp.net web application in c# and have hit a slight problem when viewing a page on the iPhone 4 and 5 (not sure about other mobiles as I've had no reports from other mobile users).

When viewing the page on a desktop browser it all works as it should. What happens is that the user enters their email address in a text box and click a button. I have some Javascript JQuery on the button that calls a web method via ajax, the web method returns an list of IDs and Names in json - the button then populates a drop down box on the web page with this information.

The user can add information to the database via a different part of the site which when they click the above button the list that is returned should be larger and include the new information. However I've noticed on the iphone 5 that when I've gone back to the page the ajax call doesn't seem to have taken place (it briefly shows a popup when it happens) and the drop down box doesn't contain the new information in the database. I believe it's simply displaying information from the phones CACHE.

If I go into the safari settings and delete cookies & data / web data, then go to the webpage, voila all the drop down is populated and the ajax call works (please wait popup shows). I have tried adding the below line of code to my master page on page_load, but it's not worked.

Response.Cache.SetNoStore();

Is there anything else I need to do? As I say, the site works for desktop browsers, and I'm not a mobile developer (I don't even use mobiles for web browsing) so not sure what the problem is or how I can fix it in my code.

Many thanks for any help/advice.

Answer 1

Your theory that this is caching related is correct - iOS 6 caches a lot more aggressively where there's no cache-control header supplied, including POSTs. See Is Safari on iOS 6 caching $.ajax results? for more info.

We had the same issue and the approach we took for this was to add an HttpModule to the site that always sets this header for any POST request:

public class DisablePostCachingModule : IHttpModule
{
    private HttpApplication _context;
    public void Init(HttpApplication context)
    {
        _context = context;
        _context.PreSendRequestHeaders += OnPreSendRequestHeaders;
    }

    public void Dispose()
    {
    }

    private void OnPreSendRequestHeaders(object sender, EventArgs e)
    {
        if (HttpContext.Current.Request.HttpMethod == "POST")
        {
            HttpContext.Current.Response.Cache.SetCacheability(HttpCacheability.NoCache);
        }
    }
}

We hooked this up in Web.config as below and it did the trick for us:

<configuration>
  <system.webServer>
    <modules>
      <add name="DisablePostCachingModule" type="Full.Namespace.To.DisablePostCachingModule, AssemblyName" />
    </modules>
  </system.webServer>
</configuration>

Note if you aren't using IIS7's Integrated Mode you can use <system.web> instead:

<configuration>
  <system.web>
    <httpModules>
      <add name="DisablePostCachingModule" type="Full.Namespace.To.DisablePostCachingModule, AssemblyName" />
    </httpModules>
  </system.web>
</configuration>

Obviously in both cases above, you would need to update Full.Namespace.To to whatever namespace you'd used for the module, and AssemblyName to the name of the assembly in which the module resides. So for example:

<add name="DisablePostCachingModule" type="Acme.HttpModules.DisablePostCachingModule, Acme.Core" />