聚合物应用刷新策略
我们的应用程序是一个Polymer 2单页面应用程序,我们有一些自定义构建步骤来生成资源的版本化文件(gulp-rev-all)。 所有工作都很好,但我们需要实施应用程序的安全刷新。 我们正在做的是我们将最新安装的git commit保存在与应用程序一起提供的文件中,并且我们会间隔地提取该文件,并提醒用户有可用的新版本并要求他们单击按钮刷新应用程序。
问题是,我们正在使用服务工作者预先缓存作为默认聚合物版本提供。 这意味着当我们执行location.reload()时,我们实际上从服务工作者获取内容(index.html),而不是从服务器获取内容(index.html)。
所以问题是: 我们如何强制服务人员失效并强制更新service-worker.js和index.html?
这里的准备好的代码,都描述了如何处理服务人员;
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('sw.js').then(function(reg) {
// updatefound is fired if sw.js changes.
reg.onupdatefound = function() {
// The updatefound event implies that reg.installing is set; see
// https://w3c.github.io/ServiceWorker/#service-worker-registration-updatefound-event
var installingWorker = reg.installing;
installingWorker.onstatechange = function() {
switch (installingWorker.state) {
case 'installed':
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and the fresh content will
// have been added to the cache.
// It's the perfect time to display a "New content is available; please refresh."
// message in the page's interface.
console.log('New or updated content is available.');
// Need to hard refresh when new content is available
location.reload(true);
} else {
// At this point, everything has been precached.
// It's the perfect time to display a "Content is cached for offline use." message.
console.log('Content is now available offline!');
}
break;
case 'redundant':
console.error('The installing service worker became redundant.');
break;
}
};
};
}).catch(function(e) {
console.error('Error during service worker registration:', e);
});
}
链接地址: http://www.djcxy.com/p/5341.html