首页 > 解决方案 > 工作箱:动态设置调试模式

问题描述

受影响的库:workbox.setConfig

浏览器和平台:“所有浏览器”。*

问题或功能请求描述:我打算设置调试模式:true 这是我正在遵循的过程:

  1. 使用 PWA 存储模式值:缓存中的真/假
  2. 打开缓存并使用存储的变量设置调试值。
  3. 问题是一切都是异步的,并且在 workbox.setconfig 之前调用了安装事件

有谁知道任何解决方法

标签: service-workerworkbox

解决方案


各种workbox.*方法需要在服务工作者启动时同步执行,以便在事件开始触发之前加载所需的运行时包并建立适当的事件侦听器。在初始化 Workbox 之前,您将无法执行任何异步操作,例如从 Cache Storage API 或 IndexedDB 读取。

我不知道在切换 Workbox 是否处于调试模式方面需要多大的灵活性,但也许以下内容会有所帮助。它允许您使用 URL 查询参数来确定给定的 Service Worker 注册是否会触发 Workbox 的调试模式

// Inside your service worker,
// before you make any other calls to workbox.* methods.

const url = new URL(location.href);
const debug = url.searchParams.has('debug');
workbox.setConfig({debug});

然后当你注册时:

// To enable debugging:
navigator.serviceWorker.register('/service-worker.js?debug');
// To run without debugging:
// navigator.serviceWorker.register('/service-worker.js');

您可能已经知道这一点,但 Workbox 会debug: true在检测到它正在运行时自动切换到模式,localhost否则默认以生产模式运行。


推荐阅读