Firebase：更改服务工作者的位置

Question

我正在尝试使用Firebase消息服务 (Web)。Firebase默认搜索名为“firebase-messaging-sw.js”的文件，其中包含服务工作者。

服务工作者脚本应位于应用程序的绝对路径上! 例如: http://localhost/firebase-messaging-sw.js 如何更改这个默认位置？在查找官方文档时，我发现了这个方法：useServiceWorker 接受服务工作者注册，但尝试使用该方法时，我收到一个错误，指出该方法根本不存在！

那么，如何更改Firebase消息服务的服务工作者位置呢？

- Dewan159

Answer 1

正如Michael所指出的，使用的方法是useServiceWorker(<registration>)。

https://firebase.google.com/docs/reference/js/firebase.messaging.Messaging#useServiceWorker

当你调用firebase.message()时返回的是Messaging类。

因此样例代码应该是：

navigator.serviceWorker.register('./example/sw.js')
.then((registration) => {
  messaging.useServiceWorker(registration);

  // Request permission and get token.....
});

我刚刚在 Github 上的演示应用上尝试了这个，没有任何问题：https://github.com/firebase/quickstart-js/tree/master/messaging

- Matt Gaunt

---

它不再工作了。请参考@Hamid Mayeli的答案。 - Whip

示例代码在仓库中不存在。 - pratik mankar

Answer 2

我知道这是一个老问题，但因为useServiceWorker现在已经过时了，所以值得一提的是您可以直接将服务工作者传递给getToken。当前文档

const registration = await navigator.serviceWorker.ready;

const messaging = firebase.messaging();

const token = await messaging.getToken({
            serviceWorkerRegistration: registration,
            vapidKey: "",
        });

- Hamid Mayeli

---

嗨@Hamid，我按照您的方法访问令牌，但对于函数onBackgroundMessage，我遇到了这个错误-FirebaseError：Messaging：此方法仅在服务工作者上下文中可用（messaging / only-available-in-sw）。您能否指导我如何解决它？ - Arjun Pandi

你需要将这段脚本输入到navigator.serviceWorker.register('./example/sw.js')中.then((registration) => {const registration = await navigator.serviceWorker.ready;const messaging = firebase.messaging();const token = await messaging.getToken({ serviceWorkerRegistration: registration, vapidKey: "", });}); - undefined

Answer 3

你应该能够执行 firebase.messaging().useServiceWorker(registration) 并传入一个现有的服务工作者注册。请注意，在任何调用例如 getToken() 或 onMessage() 之前，尽可能早地执行此操作。

- Michael Bleigh

---

是的，当然。但是尝试这样做时，我得到了“方法不存在”的错误提示！ - Dewan159

这对我有效 - 你确定你执行的是 firebase.messaging().useServiceWorker() 而不是 firebase.messaging.useServiceWorker() 吗？ - Michael Bleigh

还要注意的是，该API是在库的3.5.0版本中添加的，因此请确保您已经更新至少到那个版本。 - jwngr

@MichaelBleigh，我按照你上面快速启动应用程序的指示进行操作，但我仍然遇到了“TypeError: Failed to register a ServiceWorker for scope ('https://xxxxxx.net/') with script ('https://dmsxxxx.net/firebase-messaging-sw.js'): A bad HTTP response code (404) was received when fetching the script”错误。Firebase仍在查找此位置https://dmsxxxx.net/firebase-messaging-sw.js。 - kodali

Answer 4

我认为这是:

const vapidKey = 'foo123...';
const serviceWorkerRegistration = await navigator
    .serviceWorker
    .register('/build/firebase-messaging-service-worker.js');

await getToken(messaging, {
    vapidKey,
    serviceWorkerRegistration,
})...

但请注意，如果您复制此代码，则作用域可能会出现错误（因为路径不正确，在我的示例中：/build/...）。

- Michael Käfer

Answer 5

通过使用useServiceWorker（registration），您可以通过现有的服务工作者使用Firebase推送消息上的notificationonclick事件。

firebase.messaging().useServiceWorker（registration）正常工作并解决了我的问题，但请记住我不知道：

• 这是否是从服务器获取有效载荷的安全方式。

• 这是否是处理推送通知的最佳方式。

- Tushar Acharekar

---

这是对问题的回答还是您自己在提问（列出的要点）？ - Nander Speerstra

以下是我关于在使用Firebase消息服务时如何处理安全性和性能方面的疑问。由于这个问题与该主题相关，因此我不打算创建单独的问题。 - Tushar Acharekar

我已经编辑了你的回答措辞，所以你的要点现在是其他用户需要考虑的事项（而不是问题）。你的回答是这个问题的很好的补充，谢谢！ - Nander Speerstra