应用程序缓存或服务工作者 - 将在2016/Q2使用？

if ( 'serviceWorker' in navigator && b ) {
navigator.serviceWorker.register('/sw.js').then(function(registration) {
// Registration was successful
showMsg('ServiceWorker registration successful with scope: ', registration.scope);
if ( registration.installing ) {
  showMsg( 'Service worker installing' );
} else if ( registration.waiting ) {
  showMsg( 'Service worker installed' );
} else if ( registration.active ) {
  showMsg( 'Service worker active' );
}
  }).catch(function(err) {
    // registration failed :(
    showMsg('ServiceWorker registration failed: ', err);
  });

// Listen for claiming our ServiceWorker
navigator.serviceWorker.addEventListener('controllerchange', 
function(event) {
      // Listen for changes in the state of our ServiceWorker
      navigator.serviceWorker.controller.addEventListener('statechange', function() {
        // If the ServiceWorker becomes "activated", let the user know they can go offline!
        if (this.state === 'activated') {
        // This example is refreshing the app directly, but you can inform the user with a fancy modal window or similar
            window.location.reload( true );
        }
      });
    });

// Browsers not using Service Workers
    } else  if ('applicationCache' in window) {
      var iframe = document.createElement('iframe');
      iframe.style.display = 'none';
      iframe.src = 'load-appcache.html'
      document.body.appendChild(iframe);
      showMsg("Iframe loaded for AppCache management");

    } else {
      showMsg("no service worker - no appCache");

 }

Run Code Online (Sandbox Code Playgroud)

初始化AppCache所描述的代码有助于在appcache文件更改时刷新新页面.我从几个来源获取它,但所有来自Patrick Kettner在2016年PWA开发峰会期间发布的强大演示文稿:(https://www.youtube.com/watch?v=IgckqIjvR9U&t=1005s)

load-appcache.html只包含

<!DOCTYPE html>
<html manifest="offline.appcache">
    <head>
        <title>loding appCache</title>
   </head>
   <body></body>
</html>

Run Code Online (Sandbox Code Playgroud)

当然,SW提供了多种可能性来提供更高级的应用程序,但使用AppCache和IDB,您几乎可以完成所需的任何业务逻辑,包括离线功能.

请注意,您无法使用Chrome测试AppCache功能,因为他们已禁用它,但您仍然可以强制使用Firefox(我已经使用50.1.0进行了测试).你可以随时使用Safari :)

Answer 3

Sal*_*lva 9

你是对的,appcache正在变得不受支持.

还有其他选项可以在IDB中存储数据和/或资产,例如:

有关更多示例,请尝试使用google搜索" offline pouchdb ember "或" offline pouchdb angular ".

现在确保脱机可用性的唯一机制是服务工作者和appcache.期.

所有这些技术都依赖于您的站点是单页面应用程序和可访问的入口点.因此,如果您不使用appcache或服务工作者来确保始终可以访问入口点,则必须回退到http缓存并在提供资产时正确设置与缓存相关的标头.无论如何,UA可以随时驱逐http缓存.

面对这个决定,如果应用程序必须离线运行并在Safari中运行,唯一的选择是使用appcache(AFAIK,没有关于从Safari中删除appcache的消息).

为了降低风险,除了appcache之外,您还可以选择结合以前的技术之一(在IndexedDB上存储资产的技术),因此您缓存的唯一内容是SPA的入口点.如果appcache不受支持且没有服务工作者替代方案,您可以切换到缓存标头替代方案.

无论如何,您可以使用功能检测(if ('serviceWorker' in navigator) { ... })来查看服务工作者是否可用并在必要时使用它.有一个基于服务工作者的appcache的polyfill叫做JakeCache(未经过测试),其他人将来.

归档时间：	9 年，7 月前
查看次数：	7333 次
最近记录：	7 年，9 月前