时间戳

首页 > 解决方案 > Firebase 通知发送成功，但我的服务人员没有显示

javascript - Firebase 通知发送成功，但我的服务人员没有显示

问题描述

我试图在我的 web 应用程序中实现推送通知系统。我有两个问题。我遵循了一个教程，但更新了它并注册了一个服务人员，因为我不是通过 firebase 托管的。

  1. 当我发送通知时，我的服务人员没有响应。
  2. 当我发送通知时，只会显示第一个发送的通知。

index.js

var firebaseConfig = {
    apiKey: "XXXX",
    authDomain: "XXXX",
    projectId: "XXXX",
    storageBucket: "XXXX",
    messagingSenderId: "XXXX",
    appId: "XXXX"
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();

//test if push is supported by browser
if((('PushManager' in window)) && ('serviceWorker' in navigator)) {
    messaging.onMessage((payload) => {
        console.log('Message received. ', payload);
    });

    navigator.serviceWorker.register('firebase-messaging-sw.js').then((objServiceWorker) => { 
        console.log("service worker registered", objServiceWorker);
        messaging.useServiceWorker(objServiceWorker);
        messaging.requestPermission().then(function () {
            console.log("Notification permission granted.");

            // get the token in the form of promise
            return messaging.getToken();
        }).then(function(token) {
            //subscribe click
            ...save token to db

            //unsubscribe click
            ...delete token from db
        }).catch(function (err) {
            console.log("Unable to get permission to notify.", err);
            fallback();
        });
    }).catch(function(err) { 
        console.log('Service worker registration failed, error:', err);
        fallback();
    }); 
} else {
    fallback();
}

firebase-messaging-sw.js

importScripts("https://www.gstatic.com/firebasejs/8.6.5/firebase-app.js");
importScripts("https://www.gstatic.com/firebasejs/8.6.5/firebase-messaging.js");
var firebaseConfig = {
    messagingSenderId: "XXXX",
    projectId: "XXXX",
    apiKey: "XXXX",
    appId: "XXXX"
};
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function(payload) {
    console.log('[firebase-messaging-sw.js] Received background message ', payload);
    
});

生成通知.php

$arrHeaders = array(
    "Content-Type: application/json",
    "Authorization: key=XXXX"
);
$arrPostFields = array(
    "notification" => array(
        "title" => "Notification Title",
        "body" => "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
        "icon" => "https://www.whatever.com/images/symbol.svg",
        "click_action" => "https://www.whatever.com/index.php?id=736",
    ),
    "to" => $strRegistrationID,
    "priority" => "high"
);
$curl = curl_init();
curl_setopt($curl, CURLOPT_URL, $strEndPoint);
curl_setopt($curl, CURLOPT_HTTPHEADER, $arrHeaders);
curl_setopt($curl, CURLOPT_POSTFIELDS, json_encode($arrPostFields));
curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($curl, CURLOPT_POST, TRUE);
$arrOutput = curl_exec($curl);
curl_close($curl);

$arr输出=

{"multicast_id":12345,"success":1,"failure":0,"canonical_ids":0,"results":[{"message_id":"0:1234XXX"}]}

标签： javascriptfirebasecurlpush-notificationfirebase-cloud-messaging

解决方案

对不起，伙计们，它工作正常，只是不符合我的预期。我将把我的问题留在这里，希望我的代码可以帮助其他人:)

推荐阅读