Laravel中FCM V1 API推送无通知且无报错问题解决

我在Laravel项目中使用Firebase Cloud Messaging API (V1)发送FCM Web推送通知，此前一直正常接收，但现在无法收到通知，且接口返回成功状态无任何报错。已验证设备token有效、权限已开启，使用的是agence-appy/fcmhttpv1包，尝试多个token和设备均无效。

原Service Worker代码 #

/* Give the service worker access to Firebase Messaging. Note that you can only use Firebase Messaging here, other Firebase libraries are not available in the service worker. */ 
importScripts("https://www.gstatic.com/firebasejs/7.23.0/firebase-app.js");
importScripts( "https://www.gstatic.com/firebasejs/7.23.0/firebase-messaging.js" );

/* Initialize the Firebase app in the service worker by passing in the messagingSenderId.
New configuration for app@pulseservice.com */
firebase.initializeApp({ 
    apiKey: "", 
    authDomain: "", 
    projectId: "", 
    storageBucket: "", 
    messagingSenderId: "", 
    appId: "*", 
});

self.addEventListener("push", function (event) { 
    var data = event.data.json().data;

    const title = data.title;
    //data.Data.actions = data.Actions;
    const options = {
        body: data.body,
        icon: data.icon,
        image: data.image,
        data: data.action,
    };
    event.waitUntil(self.registration.showNotification(title, options));
});

self.addEventListener("notificationclick", function (event) { 
    console.log(event.notification); 
    //var data = event.data.json().data; 
    event.notification.close(); 
    event.waitUntil(clients.openWindow(event.notification.data)); 
});

self.addEventListener("notificationclose", function (event) {});

Laravel发送通知代码 #

<?php

namespace App\Notifications\Store;

use Illuminate\Bus\Queueable; 
use Illuminate\Contracts\Queue\ShouldQueue; 
use Illuminate\Notifications\Messages\MailMessage; 
use Illuminate\Notifications\Notification; 
use App\Notifications\Channels\FirebaseChannel; 
use Exception; 
use GuzzleHttp\Client; 
use Illuminate\Support\Facades\Log; 
use Appy\FcmHttpV1\FcmGoogleHelper; 
use Appy\FcmHttpV1\FcmNotification;

class NewOrder extends Notification { 
    use Queueable;
    /**
     * Create a new notification instance.
     *
     * @return void
     */
    public function __construct()
    {
        //
    }

    /**
     * Get the notification's delivery channels.
     *
     * @param  mixed  $notifiable
     * @return array
     */
    public function via($notifiable)
    {
        return FirebaseChannel::class;
    }

    /**
     * Get the mail representation of the notification.
     *
     * @param  mixed  $notifiable
     * @return \Illuminate\Notifications\Messages\MailMessage
     */
    public function toFirebase($notifiable)
    {
        $notif = new FcmNotification();
        $notif->setTitle("New Order Recived")->setBody("New Order Recieved")
            ->setToken($notifiable->devicetokens->first()->token)->setClickAction(route('order.new'))->send();
    }
    /**
     * Get the array representation of the notification.
     *
     * @param  mixed  $notifiable
     * @return array
     */
    public function toArray($notifiable)
    {
        return [
            //
        ];
    }
}

已解决

问题出在Service Worker文件中，修复后的代码如下：

/*
Give the service worker access to Firebase Messaging.
Note that you can only use Firebase Messaging here, other Firebase libraries are not available in the service worker.
*/
importScripts("https://www.gstatic.com/firebasejs/7.23.0/firebase-app.js");
importScripts(
    "https://www.gstatic.com/firebasejs/7.23.0/firebase-messaging.js"
);

/*
Initialize the Firebase app in the service worker by passing in the messagingSenderId.
* New configuration for app@pulseservice.com
*/
firebase.initializeApp({
    apiKey: "",
    authDomain: "",
    projectId: "",
    storageBucket: "",
    messagingSenderId: "",
    appId: "",
});

/*
Retrieve an instance of Firebase Messaging so that it can handle background messages.
*/
const messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function (payload) {
    console.log(
        "[firebase-messaging-sw.js] Received background message ",
        payload
    );
    /* Customize notification here */
    const notificationTitle = "Background Message Title";
    const notificationOptions = {
        body: "Background Message body.",
        icon: "/itwonders-web-logo.png",
    };

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

self.addEventListener("push", function (event) {
    var data = event.data.json().data;

    const title = data.title;
    //data.Data.actions = data.Actions;
    const options = {
        body: data.body,
        icon: data.icon,
        image: data.image,
        data: data.action,
    };
    event.waitUntil(self.registration.showNotification(title, options));
});

self.addEventListener("notificationclick", function (event) {
    console.log(event.notification);
    //var data = event.data.json().data;
    event.notification.close();
    event.waitUntil(clients.openWindow(event.notification.data));
});

self.addEventListener("notificationclose", function (event) {});

内容的提问来源于stack exchange，提问作者Owais Khan