Question

我尝试在angularJS项目中设置firebase以使用后台通知和应用通知。

我做了什么：

按npm install --save firebase
将发件人ID的manifest.json添加到根目录
将此脚本放在<head>中：
- <script src="node_modules/firebase/firebase-app.js"></script>
- <script src="node_modules/firebase/firebase-messaging.js"></script>

在<body>打开后添加此脚本：

<script>
    var config = {
        apiKey: "AIzaSyDAVuWKUL-aPoGasdEi-EMR7uFN1gtgk0s",
        authDomain: "testproject-d71.firebaseapp.com",
        databaseURL: "https://testproject-12d71.firebaseio.com",
        projectId: "testproject-12d71",
        storageBucket: "",
        messagingSenderId: "123128116401"
    };
    firebase.initializeApp(config);
</script>

在<body>
的末尾添加此脚本
- <script src="js/configFcm.js"></script>

是：

const messaging = firebase.messaging();

messaging.setBackgroundMessageHandler(function(payload) {
    console.log('[firebase-messaging-sw.js] Received background message ', payload);
    // Customize notification here
    const notificationTitle = 'Title';
    const notificationOptions = {
        body: 'body.',
        icon: '/firebase-logo.png'
    };

    return self.registration.showNotification(notificationTitle,
        notificationOptions);
});

这就是我所做的一切，我没有在应用通知中配置，只有背景通知。我在控制台出错：

未捕获的代码：   ＆＃34;消息/只可用式-SW＆＃34;

消息：   ＆＃34;消息传递：此方法在服务工作者上下文中可用（消息传递/仅可用于sw）。＆＃34;

堆栈：   ＆＃34; FirebaseError：Messaging：此方法在服务工作者上下文中可用。（消息/只可用式-SW）

什么是服务工作者？它只是客户端吗？我正在从index.html执行这些脚本，所以我很困惑。

Answer 1

您当前正在使用默认的firebase库。相反，将它与angularfire库一起使用，它将处理与firebase相关的大部分内容。下面是使用带有angularfire的firebase的基本教程：

初始化步骤很好。
在index.html中注入angularfire  <script src="https://cdn.firebase.com/libs/angularfire/2.3.0/angularfire.min.js"></script>。
将firebase注册为应用程序中的模块 var app = angular.module("sampleApp", ["firebase"])
现在你很高兴。

请按照以下参考资料获取有关如何在火焰基础上使用angularfire的更多信息。

设置firebase消息传递问题消息/ only-available-in-sw

1 个答案: