HTML5 appcache is a good way to cache resources in the client side and make them available when the user goes offline. I was playing around with this technology for sometime now, and it works pretty good so far with static resources like html, css, js, images etc.
Now I have come to a situation where I have the need to integrate some php functionality into my application. For the sake of simplicity lets say my show_tasks.php does this,
<?php
// Print the list of task names from the database.
printMyTasks();
?>
So I have put cached this page inside my myCache.appcache file like this,
CACHE MANIFEST
#v1.0
show_tasks.php
Now the issue is this.
When the user accesses this page for the first time (given he is online), the browser caches the html page along with the list of tasks those were there at that moment. But after that, even when he is online, it does not connect to the database and fetch the latest data. Instead it always shows the cached version which was cached in the first run.
I understand that in order to update the cache in the client side, a change must be done to the show_tasks.php file itself (not the data it manipulates) and also the myCache.appcache file should be updated. (In my case, a change to the show_tasks.php won't happen)
I am looking for a solution so that my application works in a way such that,
If the user is online, read the tasks from database and show them. (Don't show the cached version)
If the user is offline, show the cached version, but also with the most recently updated data. (The list of tasks fetched when he accessed it online the last time)
I have looked into Using appcache with php & database question too. But I am wondering if there is another way of achieving this. (Probably using some client side functionality) Obviously I am willing to use Javascript/Jquery.
What will be a good approach to handle this scenario?
