Firebase消息无法在Vue 3上获得令牌

Question

我正在创建一个应用程序，它将获得实时通知与防火墙云消息，但它似乎不适用于我。我正在跟踪他们的文档，在我的vue项目的根中有一个put firebase消息传递-sw.js。

我在stackblitz上发布了演示

这是我的App.vue

<script setup lang="ts">
  import { useTheme } from './services/vuestic-ui/themes'
  import { initializeApp } from "firebase/app"
  import { getMessaging, getToken } from "firebase/messaging"
  const firebaseConfig = {
    apiKey: "",
    authDomain: ",
    databaseURL: "m",
    projectId: "",
    storageBucket: "",
    messagingSenderId: "2",
    appId: ""
  }

// Initialize Firebase
const app = initializeApp(firebaseConfig)
const messaging = getMessaging(app)
getToken(messaging, { vapidKey: 'mykey' }).then((currentToken) => {
  if (currentToken) {
    // Send the token to your server and update the UI if necessary
    // ...
    console.log({currentToken})
  } else {
    // Show permission request UI
    console.log('No registration token available. Request permission to generate one.');
    // ...
  }
}).catch((err) => {
  console.log('An error occurred while retrieving token. ', err);
  // ...
})

</script>

如果您运行这个演示程序，它会说An error occurred while retrieving token. FirebaseError: Messaging: We are unable to register the default service worker.很少有关于vue 3的Firebase云消息传递的文档，我不知道如何正确地注册服务工作人员，好让Firebase消息传递在vue 3上工作吗？

Answer 1

Firebase无法访问路由firebase-messaging-sw.js，这就是您获得此错误的原因。

只要在名为JavaScript的公用文件夹中创建一个空的firebase-messaging-sw.js文件，这个错误就会消失。