Home/ Questions/Q 6084651
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T11:32:49+00:00

I am working with the HTML5 applicationCache API and I am having a problem

  • 0

I am working with the HTML5 applicationCache API and I am having a problem seeing updates to the cached page. I’m taking care of the basics – making changes to the manifest file, making sure the manifest isn’t caching on the client, and reloading the page after the new version of the cached page is downloaded (after onupdateready event).

I know the applicationCache API is supported in Chrome and FireFox, but I can only see the desired behavior (changes in cached page after updating manifest) in Opera and Safari.

Therefore, how do I ensure that I can see the latest cached version of the page in Chrome and FireFox?

Here’s my HTML/JavaScript (index.htm):

<!doctype html>
<html manifest="manifest.aspx">
<head>
    <title>Log</title>
    <script>
        window.onload = function () {

            if (window.applicationCache) {
                var log = document.getElementById("log");

                function logEvent(msg) {
                    log.innerHTML += "<li>" + msg + "</li>";
                }

                window.applicationCache.onchecking = function (e) {
                    logEvent("checking cache");
                }

                window.applicationCache.oncached = function (e) {
                    logEvent("cached");
                }

                window.applicationCache.onupdateready = function (e) {
                    logEvent("update ready");
                    logEvent("swapping cache");
                    applicationCache.swapCache();
                }

                window.applicationCache.onnoupdate = function (e) {
                    logEvent("no update");
                }

                window.applicationCache.onobsolete = function (e) {
                    logEvent("obsolete");
                }

                window.applicationCache.ondownloading = function (e) {
                    logEvent("downloading");
                }

                window.applicationCache.onerror = function (e) {
                    logEvent("error");
                }

                logEvent("window load");
            }
        }
    </script>
</head>
<body>
    <div>
        <h1>Message Logger 15</h1>

        <div id="eventLogContainer">
            <h2>Event Log</h2>
            <ul id="log"></ul>
        </div>

    </div>
</body>
</html>

Here’s my manifest (manifest.aspx):

CACHE MANIFEST
# version fifteen

CACHE:
index.htm

My manifest is a ASPX file, but the Content-Type is set to text/cache-manifest and Encoding is set to utf-8.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Although updating the cache manifest will cause the browser to check for new files, whether or not those files are fetched from the server or from the local browser cache is determined by regular caching rules. Thus if your browser is configured to only look for a new version of any file once per day, or there are future expires headers being served with the files listed in your cache manifest, those files will not be updated when you update the manifest file (unless you empty the browser cache, or do a CTRL + F5).

    So in short: check what headers index.htm is getting served with.

    • 0