Search code examples
apihtml5-appcache

Strange issue with AppCache


I have an angular site that uses AppCache (http://appcache.offline.technology/) file to cache the websites dependencies. The issue I am having is that calls the site makes to the API are failing and returning with "Provisional headers are shown" message when I view it in chrome dev tools.

Preflight OPTIONS request returns 200 OK response but for some reason the GET request have the error.

If I don't use the appcache file then everything is fine and all calls to API work without any problems. Nothing I try seems to fix the issue apart from just not using the appcache file!


Solution

  • Every resource you consume with in your app must be listed somewhere in your appcache file. Try adding

    NETWORK:
    * 
    

    to your appcache file and see if that solves your problem. The NETWORK section lists resources that can be accessed online, but not offline. If you want all of those resources cached, list your api endpoints in your CACHE section. I don't recommend this, however. For API resources, I recommend the network wildcard listed above. Then, detect if you are online or offline with network.onLine before making any ajax calls. If your're offline, fallback to a local storage solution.

    From this site:

    The line marked NETWORK: is the beginning of the “online whitelist” section. Resources in this section are never cached and are not available offline. (Attempting to load them while offline will result in an error.)

    Similar to this question.