HTML5 Android Phonegap Web app not working offline with cache manifest

Question

I have a simple web app built with Phonegap and Android that call external ressources (js, css, html) from server instead of storing it in Phonegap assets folder. I prefer using external ressources because my server can deliver html pages taking in charge internationalization.

This web app work fine on my android device when WIFI is on but it fail when stopping WIFI. My index.html file delivered by my server contain a valid manifest file with correct mimetype ('text/cache-manifest') that list every files the app need to work.

My Android Activity class is supposed to have caching enable:

    this.appView.getSettings().setDomStorageEnabled(true);
    this.appView.getSettings().setAppCacheMaxSize(1024 * 1024 * 15);  

    String appCachePath = getApplicationContext().getCacheDir().getAbsolutePath();
    this.appView.getSettings().setAppCachePath(appCachePath);
    this.appView.getSettings().setAllowFileAccess(true);
    this.appView.getSettings().setAppCacheEnabled(true);

It may worth mentionning that my app use ajax call with urls like /aaa/bbb/ to call web pages from server and I don't know if that may be the problem (l'm not calling physical pages directly like index.html)... However, this web app work well in desktop browser (Google Chrome) when offline...

Any idea what more can I do to enable this HTML5 cache feature on my Phonegap app?

Thanks a lot

Doggy

Answer 1

After playing around for a while I get it to work. Here is some points you should verify when stucked with this type of caching problem:

• Take care about url parameters passed with GET method... I was passing parameters when navigating between pages of my app and those parameters was making my urls different from the ones in manifest file making cache to fail.
• When testing offline mode on my phone, I was only shutting down the WIFI thinking this was enough to trigger cached version of my app but it was not... As I was testing my app published under a local network IP (like 192.168.2.11), it appear that my app was trying to reach that IP trough the 3G network that was still ON... So use airplane mode when testing offline.
• Not sure if this one was necessary as I read it on some others threads but I renamed my manifest file to cache.manifest.

Regards

Doggy

Answer 2

Apparently you need "to fix the Android Shell Native App to enable HTML5 caching".

If you haven't already, please check out:

http://tmkmobile.wordpress.com/2012/03/04/html5-offline-solution/

Hluchy

Thanks but this is already done... You can see the fix in my question – Neckwear

Answer 3

I am developing a similar system. What I did was I created the Phonegap webpages and stored them in the www folder of my WAMP server. Then what I do is I basically super.LoadURL("insert_ip_address_here/insert_name_of_folder_where_webpage_is_located") in the onCreate method and this loads the phonegap application perfectly (yes all you need is just only line of code in the Android app itself). However you still have to make sure that the config.xml, manifest and all configurations needed for phonegap are properly done (for instructions on this see https://www.adobe.com/devnet/archive/html5/articles/getting-started-with-phonegap-in-eclipse-for-android.html).

Let me know if this the path you choose to pursue. I can provide extra support with things like making the ip-address (in the line super.loadurl(...)) dynamic for the local system using multi-casting, etc.

Janinejanis

Yes, this is basically what I'm doing, I call my remote index.html with super.LoadURL(my http url) in the onCreate method. If you check in my question I also define various settings to enable caching in this same method... – Neckwear

Interesting, will the caching make the app run faster? (Im thinking about implementing it in my own code). – Janinejanis