类型错误:无法更新作用域的 ServiceWorker - 获取脚本时发生未知错误 创建 React 应用程序

问题描述

我使用的是未弹出版本的 create react 应用程序 (v3.2 react-scripts)。我正在提醒用户通过 Service Worker 推送的新版本代码。当 Service Worker 检测到更新时,我们会弹出一个 Toast 通知,要求用户刷新浏览器。

除非用户打开多个标签,否则这在大多数情况下都非常有效。

我们每天大约有 30 人使用此工具(这是我公司的内部工具)。几乎每个更新都适用于每个用户。他们收到要刷新的通知,刷新浏览器并获得新代码。偶尔有一个随机用户会收到以下错误

TypeError:无法更新作用域的 ServiceWorker - 使用脚本 ('/service-worker.js'):获取脚本时发生未知错误

这种情况通常发生在单个用户身上,而且这个用户经常打开多个标签页。一旦用户达到此状态,更新检查的轮询就会反复失败,并且用户永远不会收到更新通知,因此卡在旧版本的代码中,不知道应用程序已更新。

用户点击上面的错误后,他们会收到以下错误,直到所有选项卡都关闭并刷新:

TypeError:无法更新作用域的 ServiceWorker - 使用脚本 ('/service-worker.js'):ServiceWorker 脚本评估失败

认 Service Worker 中唯一更改的代码是下面提到的 2 个块:

function registerValidSW(swUrl,config) {
  navigator.serviceWorker
  .register(swUrl)
  .then(registration => {

    **** CODE ADDED START *****
    // Check for updates every 5 minutes
    setInterval(() => {
      try {
        registration.update();
      } catch(e) {
        config.onFailedUpdate();
      }
    },(1000 * 60) * 5);
    **** CODE ADDED END *****

    registration.onupdatefound = () => {
      const installingWorker = registration.installing;
      if (installingWorker == null) {
        return;
      }
      installingWorker.onstatechange = () => {
        if (installingWorker.state === 'installed') {
          if (navigator.serviceWorker.controller) {
            console.log(
              'New content is available and will be used when all'
            );

            **** CODE ADDED START *****
            // Trigger toast notification to inform user of update
            if (config && config.onUpdate) {
              config.onUpdate(registration);
            }
            **** CODE ADDED END *****

如果有人知道什么可能导致这些零星的“获取脚本时出现未知错误”,我们将不胜感激。

我尝试在整个 Service Worker、注册和定期检查中引入 try/catch 块,但脚本获取错误似乎并没有达到我可以捕获并提醒用户出现问题的程度。

任何帮助将不胜感激。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)