9

Im' working on a mobile webapp that connects to an online database, loads data from that database in an offline local mysqlite database, and should then be available offline. I got the whole database stuff working, but the app is still not available offline because it does not cache all resources correctly.

My manifest looks like this:

CACHE MANIFEST
# Cache manifest version 0.0.5

http://www.mywebsite.com/appfolder/app/detail.html
http://www.mywebsite.com/appfolder/app/index.html
http://www.mywebsite.com/appfolder/app/list.html
http://www.mywebsite.com/appfolder/css/style.css
http://www.mywebsite.com/appfolder/src/iscroll.js
http://www.mywebsite.com/appfolder/js/jquery-1.5.1.min.js
http://www.mywebsite.com/appfolder/thumbs/1872A.jpg
http://www.mywebsite.com/appfolder/thumbs/1913.jpg
http://www.mywebsite.com/appfolder/thumbs/1916.jpg
http://www.mywebsite.com/appfolder/thumbs/1925.jpg
http://www.mywebsite.com/appfolder/carsimages/1872A_1.jpg
http://www.mywebsite.com/appfolder/carsimages/1872A_2.jpg

NETWORK:

# All URLs that start with the following lines
# are whitelisted.

CACHE:

# Additional items to cache.

FALLBACK:

The app runs smooth while online, but once I go offline I get these error messages: "Myappname could not be opened because it is not connected to the internet" (in "added to homescreen"-view on an iPad) and "Safari cannot open the page because it is not connected to the internet" (in safari-view on that same iPad)

Steps I already took: Made sure the manifest got served by the correct content type by adding this to my .htaccess file

AddType text/cache-manifest .manifest

Any ideas why this does not work?

laurens peeters
  • 545
  • 1
  • 3
  • 13
  • Has anyone seen a definitive answer to offline mode cache and home screen HTML5 webapps in v4.3? I have tried all of the remedies in this thread and no luck. Is it broken or is there a workaround? –  Jun 01 '11 at 15:37
  • Jeff, try what i did: http://stackoverflow.com/questions/5645798/html5-cache-manifest-in-an-added-to-homescreen-mobile-webapp-doesnt-seem-to-wo/7022283#7022283 – Muxa Aug 11 '11 at 07:28
  • did you get this working? can I ask how you stopped your home screen app from opening safari as soon as the user clicks a link? – Steve Aug 25 '11 at 02:34

7 Answers7

14

For the iPad, the cache manifest file MUST BE named as "cache.manifest". This fixed the issue for me.

tjmadsen
  • 149
  • 1
  • 4
  • 1
    +1 I was surprised to find this worked for me too, I had verified the iPad was fetching my manifest, and acting on it (I added some files my app didn't actually reference, and they showed up in the server logs). – Paul Dixon Dec 30 '11 at 15:08
  • Well, I got this working on multiple projects now without that specific name being set. I will try to find out what was wrong with this specific project. – laurens peeters Mar 02 '12 at 23:50
1

The resources must be under the CACHE section. See http://www.html5rocks.com/en/tutorials/appcache/beginner/

Eirik Hoem
  • 1,310
  • 7
  • 14
1

If you are connecting to an online resource, I would expect to see the URL to that resource in the NETWORK section. Every URL accessed by the application needs to be listed in the manifest either explicitly or implicitly.

Try adding:

NETWORK:
*

To indicate that any URL might potentially be accessed while online.

Liza Daly
  • 2,933
  • 23
  • 31
0

I am curious about Liz Daly's answer. I am using an iPad which I just (regrettably) updated to iOS 4.3 from iOS 4.2. I had an HTML5 offline app working fine which can run from Home Screen without needing an Internet connection and be able to save state into the localStorage store.

After I updated my iPad to iOS 4.3, this very app now does NOT work without having an Internet connection to reload the page each time I start it from the Home screen and also, the localStorage gets wiped out when I power off the iPad.

So, I am having REAL problems with Safari running my offline app on iOS 4.3 on my iPad and there is no news from Apple when or if they are going to fix this issue (at least restore it back to the same functionality in iOS 4.2).

CK Lee
  • 21
  • 1
0

Update to my previous post. I can now run my HTML5 offline app on my iPad. First I believe you will need to update the iPad to at least 4.3.2 (unconfirmed but I am using 4.3.3 now). And more importantly, the cache manifest file MUST BE named as "cache.manifest". In my experiments, if you use any other name, then it will not run offline. I have my offline running in full screen mode (i.e. set "apple-mobile-web-app-capable" to "yes") and it will run from the Home Screen in Airline mode.

So Liz Daly is partially correct. The offline mode seems to only work under the above constraints only.

CK Lee
  • 21
  • 1
  • Calling the manifest cache.manifest didn't help me. I'm doing everything correctly, as far as I know, including setting the mime-type. – Mauvis Ledford May 13 '11 at 17:54
  • I have iPad with 4.3.2, had same problems. Here's what worked for me: http://stackoverflow.com/questions/5645798/html5-cache-manifest-in-an-added-to-homescreen-mobile-webapp-doesnt-seem-to-wo/7022283#7022283 – Muxa Aug 11 '11 at 07:29
0

I had the same issue on iPad. Turns out that it does not like cache manifest files in a folder. I had /Content/cache.manifest and it did not work (the app wouldn't load from the home screen when offline). When i moved the manifest file to the app root and changed manifest reference to cache.manifest it started working.

(It does not have to be called cache.manifest - i have it working with CacheManifest.ashx)

Muxa
  • 5,563
  • 6
  • 46
  • 56
-3

I understand that in iOS 4.3 the HTML 5 "offline web app" function is broken:

http://www.theregister.co.uk/2011/03/15/apple_ios_throttles_web_apps_on_home_screen/

What's more, such "home screen web apps" can't use various web caching systems, including the HTML5 Application Cache, which means they can't be cached to run offline.

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

Community
  • 1
  • 1
Jonathan
  • 7,536
  • 4
  • 30
  • 44
  • 1
    That article is full of misinformation. The offline cache works fine in fullscreen mode in all iOS versions -- my app uses it. – Liza Daly Apr 13 '11 at 13:06