1

I've got an application that is using AppCache to store resources in the browser's cache. I've been able to set up the manifest on a PHP file in order to write automatically all files that must be cached (properly filtered). The headers of this file are the following:

header('Content-Type: text/cache-manifest');
header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");

It's called appcache.php and it's referenced correctly in my HTML:

<html manifest="appcache.php">

Everytime I update the manifest, the app detects the update and the events are triggered properly, updating the cache and refreshing the page so they are reloaded.

However, some of the files (mainly Javascript and CSS files) do not refresh properly. Sometimes it takes a few manifest updates (with the whole process), sometimes it takes just one, sometimes it takes forever and I have to delete the browser cache or go Incognito mode.

The app detects the update, so the manifest is not getting catched and it's getting updated correctly. The problem is that, even the files are downloaded again, they are still served in an older version. And the main problem is that this only happens in some files (sometimes they're some css files, sometimes they're js, and so on: the files not updated are random).

Actually, I'm using Chrome v59, and it happens the same on my Android device with Chrome v60.

Is there any explanation to why they're not refreshing correctly? Is this a known bug? Is there anything I can do to solve it?

UPDATE

It seems that it happens the most when I've done some updates with short time between them. After waiting 24h or so, it works at the first try. Maybe this can help you to guess why it happens.

Thank you.

Unapedra
  • 2,043
  • 4
  • 25
  • 42
  • Did you ever find a solution for this? – Toby Jul 19 '18 at 19:01
  • I'm afraid that I couldn't... I hope they have solved it by now or at least improved it, maybe with service workers (it's been a lot since last time I worked with offline cache). – Unapedra Jul 20 '18 at 06:21

1 Answers1

0

It is possible that your manifest file is getting cached, you can set the expires headers for it to expire rightaway

I would suggest adding swapCache method

$(function() {    
 if (window.applicationCache) {
        applicationCache.addEventListener('updateready', function() {        
     if (window.applicationCache.status == 
       window.applicationCache.UPDATEREADY) {
       window.applicationCache.swapCache();
       console.log("appcache updated");
       window.location.reload();
      }
     });
    }
  }

Other thing ,To force any new (or changed) file to be downloaded, you must update the manifest file (Which seems like you are doing it).

The most common one is that you might not be serving the manifest with the right mime type (text/cache-manifest).

You might be getting error, The easiest way to check error is to open the page in Chrome and look in the console and the resources tab under AppCache to see if there is an error (it will complain about the file being served up incorrectly. You can also test it with the curl -I command:

curl -I $manifest_file_URL
pk_code
  • 2,608
  • 1
  • 29
  • 33
  • 1
    It does the whole process correctly, and the manifest gets updated (or the events wouldn't be triggered). There is no error, neither. And it's not getting catched because the app detects it has changed. The problem is that some files refresh while others (mainly js and css) do not. – Unapedra Jul 07 '17 at 22:58