The tutorial you are pointing

John_N_1 · ‎02-27-2015

Hi good pple,

This is what I have done to cache my app, but it's not working:

-Edit the <html> tag on the index.html file to point to the manifest file <html manifest="http://localhost/template-login-view-master/www/php/cache.manifest">

-Create a file named cache.manifest inside the php folder. Add in that file these lines:

    CACHE MANIFEST
   # rev 42
    CACHE:
    clickSlider.png

clickSlider.png is a file the app uses somewhere. It's located in the php folder.

-Create a file named .htaccess inside the php folder with this line :

AddType text/cache-manifest .manifest .

When I stop the server and refresh the app, it doesn't show anything. Please help.

Swati_S_Intel1 · ‎03-01-2015

I believe you need to include index.html also in the cache manifest file. Please follow this article for app cache manifest file.

http://www.html5rocks.com/en/tutorials/appcache/beginner/#toc-manifest-file-creating

Swati

John_N_1 · ‎03-01-2015

Hi Swati, caching

I have edited the manifest file and added index.html. Still it's not caching. To help view what's going on , I added these lines on the index.html file :

            $.ui.launch(); // This line helps you (Swati) see where I have added these lines of code
            if (!window.applicationCache) {
            console.log('appcache failed');}
             else {
   var appCache = window.applicationCache;
   switch (appCache.status) {
     case appCache.UNCACHED: // UNCACHED == 0
      console.log('UNCACHED');
      break;
     case appCache.IDLE: // IDLE == 1
      console.log('IDLE');
      break;
     case appCache.CHECKING: // CHECKING == 2
      console.log('CHECKING');
      break;
     case appCache.DOWNLOADING: // DOWNLOADING == 3
      console.log('DOWNLOADING');
      break;
     case appCache.UPDATEREADY: // UPDATEREADY == 4
      console.log('UPDATEREADY');
      break;
     case appCache.OBSOLETE: // OBSOLETE == 5
      console.log('OBSOLETE');
      break;
     default:
      console.log('UKNOWN CACHE STATUS');
      break;
   };
   console.log(window.applicationCache.status);

On the console log, I see Uncached. Please help me Swati, as I cannot figure out another option to caching. This feature is very crucial to the app dev process. Thanks

John_N_1 · ‎03-01-2015

The tutorial you are pointing to, and others I have looked at, refer to web apps and websites where the app files -HTML, JS, CSS are located in a web server, so the browser actually will download these files and save them locally. But hybrid apps are different; these files are located in the app the user downloads and not on the server.

Swati_S_Intel1 · ‎03-01-2015

That's correct. The hybrid apps are downloaded and reside on the device. It is only in the case of webapps/websites that you need to cache the app/data. For hybrid apps, if you are trying to get data, typically the data is fetched via ajax call to the server and if you want you can use local storage to save the data for later use.

Swati

Hamilton_Tenório_da_ · ‎03-02-2015

Do you want save little data as cookies?

I am using this (to get):

function funRecuperaOpcoes() {
  try {
        if(typeof(window.localStorage) != 'undefined') {
            if (window.localStorage.getItem(2)) {
                wNomeUsuario = window.localStorage.getItem(2);
                $.query('#camNomeUsuario').val(wNomeUsuario);
            }
            if (window.localStorage.getItem(3) == "s") {
                $.query('#detalhesUploadDownload').attr('Checked','Checked');
            } else {
                $.query('#detalhesUploadDownload').prop('checked', false);
            }             
        } else {
            alert('window.localStorage, not defined');
            }
    }
    catch(err){
        alert('store_local,error,' + err);
    }
    }

and to save:

function funGravaNomeUsuario() {
    wNomeUsuario = $.query('#camNomeUsuario').val();
    try {
        if(typeof(window.localStorage) != 'undefined') {
            window.localStorage.setItem(2, wNomeUsuario);
            }
        else
            {
            alert('window.localStorage, not defined');
            }
    }
    catch(err){
        alert('store_local,error,' + err);
    }
}

John_N_1 · ‎03-02-2015

Thanks Swati & Hamilton for your replies. From the comments above, I can conclude that caching hybrid apps is not possible. Local storage is not sufficient for this purpose, either. Sadly am beginning to realize the difference between native & web apps when am almost getting ready to release my first ever app. This is the only thing that is not working in the entire project. How sad for me...

Hamilton_Tenório_da_ · ‎03-02-2015

Web SQL is not enough for you? I use it with good results.

John_N_1 · ‎03-02-2015

Mr Hamilton,

Am developing an app similar to the facebook app. How do I use Web SQL to save several posts comprising of images, may be videos and text the user has viewed ? Is it really practical ?

Hamilton_Tenório_da_ · ‎03-03-2015

I´m not sure. You maybe need to use this database only for temporary store. When connected, the program transfer the content to server.

PaulF_IntelCorp · ‎03-09-2015

Try using this plugin for your local database storage: https://github.com/brodysoft/Cordova-SQLitePlugin

App Cache