angular - SPA Angular index.html 未更新缓存(我使用缓存破坏)

Question

我在我的应用程序 SPA 中使用了一个简单的结构，类似于此:
http://mcalthrop.github.io/angular-spa-demo/#/resources (tks 示例 mcalthrop)

在 index.html( header )中有一个带有缓存破坏(hash)的 Assets (js、css)的初始加载，之后，仅加载模板和 json(主体)AngularJS。

问题在于它们是，即随着安装更新的功能仅在用户使用 Ctrl + R(硬重新加载)或注销时才加载。我们的客户可以在页面打开的情况下度过几天。

报告了类似的问题:
Refreshing a cached Angular SPA

我使用 grails， Angular 1.6，主动破坏缓存。

Answer 1

找到“创意”替代方案:

解释:在 SPA Assets 文件上加载独特的生命周期应用程序。但是，就我而言，用户登录了很长时间，他们想要新版本的 Assets 而无需新的登录。所以当缓存中的新 js/css 可用时我会做什么，我正在刷新页面。如果没有，继续。

function urlAssetOk(url) {
        var http = new XMLHttpRequest();
        var urlWithoutCache = url + "?t=" + (new Date()).getTime();
        http.open('HEAD', urlWithoutCache, false);
        http.send();
        return http.status == 200;
    }

    function updatedCache() {
        var jsApplicationAsset = document.querySelectorAll('[class="application-asset"][src*=application-]')[0];
        var cssApplicationAsset = document.querySelectorAll('[class="application-asset"][href*=application-]')[0];
        var jsObsolete = jsApplicationAsset && !urlAssetOk(jsApplicationAsset.src) ? true : false;
        var cssObsolete = cssApplicationAsset && !urlAssetOk(jsApplicationAsset.src) ? true : false;

        if (jsObsolete || cssObsolete) {
            window.location.reload(true);
        }
    }

    window.onhashchange = function() {
        updatedCache();
    }