How can I clear the cache of an IOS Web App on the Homescreen?

Question

I am using JQTouch to create a Web App on the Homescreen using meta tag "apple-mobile-web-app-capable", but no matter how many times I clear the cache from within Settings, the Web App's Javascript is still an older cached version.

Strangely enough, if I set the meta tag's content to;

<meta name="apple-mobile-web-app-capable" content="no" />

...then add the Web App to the Homescreen, I get the latest version when I launch it.

Yet if I set the meta tag to;

<meta name="apple-mobile-web-app-capable" content="yes" />

...then add the Web App to the Homescreen, I get the older cached version.

PS. I can confirm that is only the javascript which will not refresh.

Solution 1

You could try adding a unique string to the end of your js include's src attribute (use a timestamp, for example). Bear in mind you'll have to change this unique string for each refresh you want to do, so you may want to consider doing lazy-loading (which may in itself solve your problem): <script type="text/javascript" src="myScript.js?012345"></script>

This usually forces the browser into grabbing the latest version of the script. Might work...

Solution 2

This is a way that worked for me to clear completely the cache:

1-Delete the tabs in safari where there is your app.
2-Delete the icon of the app in the home screen.
3-Kill safari from the memory.
4-Go to settings/safari and press clear cache.
5-You can restart your iPhone/iPod if you want to be sure that it works

Solution 3

I found that using bundling feature in ASP.NET MVC solved this problem for me.

It automatically generates a bundled link of the form:

http://www.domain.com/MvcBM_time/bundles/AllMyScripts?v=r0sLDicvP58AIXN_mc3QdyVvVj5euZNzdsa2N1PKvb81

The token after the v= changes if any file in the bundle changes, guaranteeing that browser requests for the bundle will get the latest bundle.

Comments

[bearroast]

Same technique works for CSS files. <link rel="stylesheet" href="css/style.css?3432">

[Alexandre Khoury]

And images : <img src="foo.png?12345" />

[Oliver Pearmain]

This is the exact same procedure I used to use but since iOS 6 it doesn't seem to be working, the homescreen app still picks up cached data.

[stvn]

unbelievable, I've been breaking my head on this for a whole day (css problem for me). A similar problem exists with Silverlight, unbelievable that 2 mayor companies make these kind of BUGS! Thanks!

[Alexander]

There's no such file on my iOS 5.1.1 device, and still my main.js is taken from cache (regular safari gets a file from server ok though)

[Shahar]

Hi, My problem doesn't regard the controlled resources, I have a cookie which makes an infinite loop which cause an error "too many redirections" on my app. I tried every possible way to delete the cache without success. any ideas how to clear the cookie?

[rookie1024]

Only issue with that is that Visual Studio's browser link feature doesn't work with bundling.

[HumbleBeginnings]

@rookie1024 VS BrowserLink does in fact work with bundling. Are you using Mads Kristensen's extension here - visualstudiogallery.msdn.microsoft.com/… ?

[rookie1024]

@HumbleBeginnings No, I am not, however I now know that BrowserLink only loses track of files if you have BundleTable.EnableOptimizations set to true in Debug mode.

[Selirion]

Good solution, but my web application loads old version on index.html :))

[dgatwood]

I've tried that. It used to work in iOS 6 or so, but it doesn't seem to work in iOS 10.

[Chris]

Yeah I don't know if this is valid in the latest version.

[dgatwood]

And in iOS 10, it caches the HTML, too, so specifying a ?foo=... to the resource doesn't work because it never sees the updated version of the HTML with the new URL. Basically, caching of home-screen web apps is hopelessly broken at this point unless you have a cache manifest (and maybe even then—I haven't tried yet).

[dgatwood]

Yeah, the only way that seems to work in iOS 10 is to change the URL for the HTML file in a similar way and add versioning for all other files referenced by the HTML. This might also be solved by adding a cache manifest, but only if you remember to add the cache manifest initially. Otherwise, the old HTML that lacks a cache manifest will get cached permanently, and you're back to adding ?version=1 to the HTML URL. :-)

[michal-michalak]

Please be aware if you do that you will lose opened Safari tabs. If you have something interesting for later reading there it will be gone.