CODEWITHSUNDEEP
javascripthtmlgoogle-app-enginegoogle-chromehtml5-appcache
MdaG
MdaG

Reputation: 2730

My webpage doesn't load changes due to cache

I've tried making use of the caching feature of modern web browsers, but it's working too well. The only way to I can make the browser recache data is by modifying the manifest file.

Sure I can add a comment in the manifest file with a version number to force the browser, but the manual work needed feels like an ugly hack. Is there no other way?

I've tried making use of:

var loadNewCache = function() {
            window.addEventListener('load', function(e) {
                window.applicationCache.addEventListener('updateready', function(e) {
                    var newUpdates = (window.applicationCache.status == window.applicationCache.UPDATEREADY);
                    if (newUpdates) {
                        window.applicationCache.swapCache();
                        window.location.reload();
                    }
                }, false);
            }, false);
        };

But the events are never triggered.

I'm running on Google AppEngine and have this in my app.yaml

- url: /html_client/(.*\.appcache)
  mime_type: text/cache-manifest
  static_files: html_client/\1
  upload: html_client/(.*\.appcache)

edit

I made it work with this script which is run as a prepend to deploy. It's not pretty, but it works.

#!/usr/bin/python

def main():
    """
    Takes the current git sha id and replaces version tag in manifest file with it.
    """
    from subprocess import Popen, PIPE

    input_file = open("manifest.appcache", 'r')
    output_file = open("manifest.appcache.tmp", 'w')
    try:
        git_sha_id = Popen(["git rev-parse --short HEAD"], stdout=PIPE, shell=True).communicate()[0]
        target_line = "# Version: "
        for line in input_file:
            if target_line not in line:
                output_file.write(line)
            else:
                output_file.write(target_line + git_sha_id)
    except IOError as e:
        print "I/O error({0}): {1}".format(e.errno, e.strerror)
    finally:
        input_file.close()
        output_file.close()
        Popen(["mv -f manifest.appcache.tmp manifest.appcache"], stdout=PIPE, shell=True)

if __name__ == "__main__":
    main()

Upvotes: 1

Views: 170

Answers (1)

Lipis
Lipis

Reputation: 21835

You don't need to do anything ugly and changing the manifest files.

All you need to do is to add the current version of the app in the end of the url that you're loading the static files. This version number is changing with every deployment so it is going to be cached after every new deployment.

<link rel="stylesheet" href="/static/css/main.css?{{VERSION}}" type="text/css" />

Where {{VERSION}} could be the os.environ.get('CURRENT_VERSION_ID', '') while running on production and maybe just a random number when running locally.

You can check if you're running locally using the os.environ.get('SERVER_SOFTWARE',''). Here a simple example to get this value that you later on should pass to your base template:

import random
import os

if os.environ.get('SERVER_SOFTWARE','').startswith('Development'):
  VERSION = random.random()
else:
  VERSION = os.environ.get('CURRENT_VERSION_ID', '')

Upvotes: 3

Related Questions