javascript - 如何在 Service Worker 中使用其他 js 文件？

Question

如何在 Service Worker 中使用其他 js 文件？我不知道将本地 js 文件包含到我的 Service Worker 中的正确方法。

index.html 中的消息处理程序

 <script src="pushjs\push.min.js"></script>
 <script src="pushjs\serviceWorker.min.js"></script>

messaging.onMessage(function (payload){
            console.log("new message: " +payload);
            //Push.create(payload.data.title);
             console.log(payload.data.title);
             console.log(payload.data.message);

              var notifTitle = payload.data.title;
              var notifMessage = payload.data.message;
              console.log(notifTitle);
              console.log(notifMessage);


                Push.create(notifTitle, {
                    body: notifMessage,
                });
             

          });

firebase-messaging-sw.js 中的后台消息处理程序

messaging.setBackgroundMessageHandler(function(payload){
    console.log(payload);

                //Push.create(notifTitle, {
                //    body: notifMessage,
                //});
                // I would want to also use this here


     
})

Answer 1

给你两个答案:

1. 如今，在现代环境中，我认为您可以通过在对 register 的调用中包含选项对象，使您的 Service Worker 成为一个模块。带有 type: "module"，这意味着您可以使用import。

   import { something } from "./somewhere.js";
   

2. Service Worker 的全局范围是 ServiceWorkerGlobalScope它实现了 WorkerGlobalScope ，其中有 importScripts您可以使用该函数将脚本加载到工作程序中。这是最后一个链接的示例:

   self.importScripts('foo.js');
   self.importScripts('foo.js', 'bar.js', ...);