Offline iOS web app: loads my manifest, but doesn't work offline

Question

I\'m writing a web app to be used offline on iOS. I\'ve created a manifest, am serving it up as text/cache-manifest, and it usually works fine, when running in

Answer 1

After days of messing with getting offline web apps to work on an iPhone/iPod Touch using the Webserver's HTTP authentication, I discovered these useful nuggets:

1. Make sure Safari is at the URL root of the web app when tapping "Add to Home Screen". I used jQuery Mobile and was sometimes adding the link with"/#pageId". Caused trouble.

2. Run your Ajax calls in serial. This might only be important if your web app is using HTTP authentication, but my app was firing a whole slew of Ajax calls on page load in parallel and it caused the app to hang on the "apple-touch-startup-image".

3. Ajax calls are "successful" when offline (at least using Prototype.js). Test for an actual piece of data in the Ajax response, not just on the HTTP status. I used this to test for displaying cached (SQL) or live data.

4. In the manifest use "NETWORK:\n*\n". From what I could muster, this is a catch-all statement for anything not explicit in the "CACHE:" section. Use Chrome to make sure your manifest is correct. Look at Chrome's console for errors.

5. Not directly related, but tripped me up for a bit, openDatabase.transaction() calls are ASYNCHRONOUS! Meaning, the line of JS code after transaction (execute(), error(), success()) will execute BEFORE the success() function.

Good luck!