I’ve been working on some mobile HTML5/jQuery Mobile applications that allow for running offline. The magic that allows for offline web apps is HTML5’s cache manifest, which tells the browser which resources, HTML, images, scripts, etc. to store on the device, and which it is allowed to access over the devices network connection. The format for this file is fairly straightforward:
However, two gotchas can make working with it difficult. First, it must be served up with a particular content type, “text/cache-manifest”, that is not always enabled on web servers. That involves some server-side tweaks, which can be tricky if you don’t have access to the server. Second, it should change anytime your app changes, so that the browser knows to re-load the resources. However, often if you change code or markup inside a file, you may forget to update your cache manifest. Or at least I did enough to come up with this alternative.
Instead of a static manifest, I serve one up via a MVC action. The action includes the assembly version and a file timestamp so that it is always versioned automatically with any change to the app.
This assumes a single page application, but could be easily adapted to add additional dependencies. Using on an application simply involves adding the following to your view: