Search code examples
htmlweb-applicationsofflineappsoffline-browsing

Prevent specific cached pages from trigging application cache updates


I'm making a web app that allows users to login in offline but only if they have logged in prevously online. The issue that I'm having is that for the user to be able to login offline, I need to cache my login page. If I do so, the cache gets updated before the user get to login and because my server redirect unauthenticated users to the login page, all the cached pages ends up being copies of the login page.

I had hope when I saw the other post with the session id being passed as a parameter to the manifest url but in my case it doesn't help since it still downloads the cache before logging in. Considering that my user might open the login page while online but only sign in late once offline.

I would need a way to stop cache updates in specific pages such as my login page without taking my login page out of my manifest. I've tried the following code but all the pages get downloaded anyway :

window.applicationCache.addEventListener("checking",function(e){
    e.stopPropagation();
    e.preventDefault();
}, true);

Solution

  • Might have found a way to do what I want. Here's my solution if ever anyone else have a similar problem.

    • Either create a login_offline.html or catch the request server side and redirect */login_offline.html to login.html.
    • Replace */login.html with */login_offline.html in the manifest and remove the manifest declaration in */login.html . Leave the manifest declaration in every pages that are available only once logged in.
    • Add a Fallback section to the manifest if not there already and in it put:

      FALLBACK: signin.htm signin-offline.htm