reactjs - Service Worker 多久刷新一次?

标签 reactjs service-worker progressive-web-apps create-react-app

我使用 create-react-app 创建了一个应用程序,默认情况下它是一个渐进式 Web 应用程序(它加载此 file )。

因此,现在每次我部署新内容时,应用程序都不会刷新。在提供缓存内容之前,它多久检查一次新内容?如何选择保存缓存的时间?

最佳答案

基于此documentation ,默认情况下,页面的提取不会通过 Service Worker,除非页面请求本身通过 Service Worker。因此,您需要刷新页面才能看到 Service Worker 的效果。

下面是一个示例,其中 3 秒后添加了狗的图像。

<!DOCTYPE html>
An image will appear here in 3 seconds:
<script>
  navigator.serviceWorker.register('/sw.js')
    .then(reg => console.log('SW registered!', reg))
    .catch(err => console.log('Boo!', err));

  setTimeout(() => {
    const img = new Image();
    img.src = '/dog.svg';
    document.body.appendChild(img);
  }, 3000);
</script>

另外,根据这个Updating your service worker ,如果您的 Service Worker 之前已安装,但刷新或页面加载时有新版本的 Worker 可用,则新版本将在后台安装,但尚未激活。仅当不再加载任何仍在使用旧 Service Worker 的页面时,它才会被激活。一旦不再加载此类页面,新的服务工作线程就会激活。

关于reactjs - Service Worker 多久刷新一次?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44204016/

相关文章:

javascript - 在 ES6 React Javascript 中导入 ReactCSSTransitionGroup

javascript - 如何清除 firebase 上的 service-worker.js 缓存

service-worker - 在 Service Worker 的获取处理程序中限制 30 倍左右的重定向

javascript - 使用服务 worker 动态缓存 HTTP URL 的包装器?

javascript - Html 弹出窗口将 PWA 图标添加到电话

reactjs - React Native 获取 View

javascript - 一组组件在reactjs中挂载后如何执行功能?

javascript - 如何更新 reducer 中对象的 1 个属性?

ios - 如何通过电子邮件链接/magic-url 登录以打开 pwa 而不是浏览器来验证 iOS 设备中的用户?

vue.js - 如何使用 vuejs 制作可安装的 PWA?