停止从缓存加载Javascript和HTML [英] Stop Javascript and HTML from Loading From Cache

问题描述

我正在构建一个单页JavaScript应用程序，当应用程序启动时，我使用一个JavaScript文件来加载我需要的其他每个文件。当我点击刷新时，根据萤火虫，我的HTML页面以及JavaScript页面将加载304未修改错误，并且我的JavaScript停止工作。

I am building a single page javascript app and when the application starts I use a single javascript file to load every other file I need on the fly. When I hit refresh, according to firebug, my HTML page as well as javascript pages will load with a 304 Not Modified Error and my javascript stops working.

我明白这是由于浏览器缓存，但我怎样才能避免这种情况？我用一个脚本调用加载初始HTML页面

I understand this is due to browser caching, but how can I avoid this? I load the initial HTML page with a single script call

<script src="js/config.js" type="text/javascript"></script>

，然后继续从该脚本中动态加载其余部分。

and then continue to load the rest dynamically from within that script

window.onload = function () {
    var scripts = ['http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js', 'js/core.js', 'js/sandbox.js']; //Application scripts
    var loaded = 0;
    //Callback is executed after all scripts have been loaded.
    var callback = function () {
        if (loaded + 1 == scripts.length) {
            //Create Modules
            CORE.loader("js/modules/Login.js", function () {
                CORE.createModule('loginForm', Login);
            });

            //Create HTML bindings.
            CORE.createBinding('appContainer', '#Login', 'login.html');
            CORE.bindHTML(window.location.hash); //Loads hash based page on startup
        } else {
            loaded++;
            loadScript(scripts[loaded], callback);
        }
    };

    loadScript(scripts[0], callback);

    function loadScript(scriptSrc, callback) {
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.async = true;
        script.src = scripts[loaded];

        if (script.readyState) {
            script.onreadystatechange = function () {
                if (script.readyState == 'loaded' || script.readyState == 'complete') {
                    script.onreadystatechange = null;
                    callback();
                }
            };
        } else {
            script.onload = function () {
                callback();
            };
        }

        document.getElementsByTagName('head')[0].appendChild(script);
    }
};

我知道Gmail使用Cookie来阻止此操作。有没有人有任何想法如何采取这种做法？我应该在服务器上设置cookie，然后在每个页面加载/刷新时使用JS检查它，如果cookie告诉我页面已从缓存中加载，请使用window.location.refresh（）之类的东西？

I know that Gmail uses cookies to prevent this. Does anyone have any idea how to take that approach? Should I set the cookie on the server and then check it with JS on each page load/refresh and use something like window.location.refresh() if the cookie tells me the page is loaded from cache?

推荐答案

缓存对于性能方面的原因非常重要。我建议你在查询字符串中传递一个版本号，并且每次更新都会增加版本号。这将强制浏览器重新发送请求，如果它已经具有相同的版本，它将从缓存中加载。

Caching is an important for performance reasons. I would recommend you pass a version number in your query string and with every update, increment the version number. This will force the browser to resend the request and it will load from cache if it already has the same version.

这篇关于停止从缓存加载Javascript和HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！