Search code examples
javascriptcordovacordova-plugins

Cordova app to auto sync/update web content (.js files) if updated version is available, else use cached one?


I have included an external .js file in my app using tag. Is it possible to use the cached version for future till the updated version of .js is available?

If updated version is available then the app should use the updated one.


Solution

  • Got it working using the following approach:

    Used fileTransfer.download with headers

    headers: {
                "If-Modified-Since": <last download date>
            }
    

    eg.

       var targetPath = cordova.file.dataDirectory + "external.js"
       fileTransfer.download(
        uri,
        targetPath,
        function(entry) {
             var success = function(status) {
             var script = document.createElement("script");
             script.setAttribute("type", "text/javascript");
             script.setAttribute("id", 'addedScript1');
             script.setAttribute("src",  targetPath ;
             document.getElementsByTagName("head")[0].appendChild(script);
            }
    
            var error = function(status) {
                alert('Error: ' + status);
            }
            window.localStorage.setItem("last_modified", new Date(new          Date()).toGMTString());
    
            window.cache.clear( success, error );
    
        },
        function(error) {
            console.log(JSON.stringify(error));
            var script = document.createElement("script");
            script.setAttribute("type", "text/javascript");
            script.setAttribute("id", 'addedScript');
            script.setAttribute("src", targetPath
            document.getElementsByTagName("head")[0].appendChild(script);
    
        },
        false,
        {
           headers: {
                "If-Modified-Since":  window.localStorage.getItem("last_modified")
            }
        }
    );