Question

从我尝试完成以来的几天开始，但是我现在完全陷于困境。

这是我的服务工作者文件中的代码

importScripts('https://www.gstatic.com/firebasejs/6.0.2/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/6.0.2/firebase-messaging.js');

firebase.initializeApp({
    messagingSenderId: "xxxxxxxxxxxx"
});

var messaging = firebase.messaging();


messaging.setBackgroundMessageHandler(function(payload) {

    console.log('[firebase-messaging-sw.js] Received background message ', payload);
    // Customize notification here
    var notificationTitle = payload.data.title; //or payload.notification or whatever your payload is
    var notificationOptions = {
      body: payload.data.body,
      icon: payload.data.icon,
      image: payload.data.image,

      data: { url:payload.data.openURL }, //the url which we gonna use later
      actions: [{action: "open_url", title: "View"}]
    };

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

 self.addEventListener('notificationclick', function(event) {


    console.log('event = ',event);
    event.notification.close();
    event.waitUntil(clients.openWindow(event.notification.data.url));

    switch(event.action){
      case 'open_url':
        window.open(event.notification.data.url);
      break;
      case 'any_other_action':
        window.open(event.notification.data.url);
      break;
    }


}, false);

数据采用这种格式

$data=[
        'title' => 'message title',
        'body' => 'description body',
        'icon' => 'https://i.ytimg.com/vi/gXSyP9ga-ag/hqdefault.jpg',
        'image'=>'https://i.ytimg.com/vi/gXSyP9ga-ag/mqdefault.jpg',
        'openURL'=>'https://google.com'
      ];

现在有很多问题。

在移动设备上单击推送通知正文时，它不会打开网址，而只会将其关闭（只有单击操作按钮才能打开链接
我在网上做了一些阅读，发现
```
event.waitUntil(clients.openWindow(event.notification.data.url));
```
无法使用Safari和Safari iPhone，有人可以帮我找到了解如何实现适用于Apple的点击甚至监听器设备？

任何帮助将不胜感激

Answer 1

在搜索了许多解决方案后，我自己找到了。这是完整的工作示例：

// firebase-messaging-sw.js (client side)

importScripts('https://www.gstatic.com/firebasejs/8.1.2/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/8.1.2/firebase-messaging.js');

self.addEventListener('notificationclick', function (event) {
  console.debug('SW notification click event', event)
  const url = '<get your url from event>'
  event.waitUntil(
    clients.matchAll({type: 'window'}).then( windowClients => {
        // Check if there is already a window/tab open with the target URL
        for (var i = 0; i < windowClients.length; i++) {
            var client = windowClients[i];
            // If so, just focus it.
            if (client.url === url && 'focus' in client) {
                return client.focus();
            }
        }
        // If not, then open the target URL in a new window/tab.
        if (clients.openWindow) {
            return clients.openWindow(url);
        }
    })
);
})

firebase.initializeApp({
  apiKey: "",
  authDomain: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
  measurementId: "",
})

const messaging = firebase.messaging();

messaging.onBackgroundMessage(function(payload) {
  console.log('[firebase-messaging-sw.js] Received background message ', payload);
})

这是NodeJS端的代码：

var admin = require("firebase-admin");
// This is a specific account key file generated through the firebase UI
var serviceAccount = require("./serviceAccountKey.json");

admin.initializeApp({
  credential: admin.credential.cert(serviceAccount),
});
const payload = {
  "token": "FCM TOKEN HERE",
  "notification": {
    "title":"James",
    body: '14100000'
  },
  "webpush": {
    "fcm_options": {
        "link": "https://google.com"
    },
  },
};
admin.messaging().send(payload).then(res => {
  console.log('SUCCESS ', res);
}).catch(err => {
  console.log(err);
}).finally(() => {
  process.exit(0);
});

问题是如果我把 notificationclick 放在底部，它不会触发，真的不知道为什么，然后我把它移到顶部并且它起作用了。我可以从服务器发送推送通知（使用 firebase-admin），并且会显示推送通知（当应用程序在后台时），点击通知打开我想要的链接。

Answer 2

您正在使用数据消息，但是您需要使用通知消息。参见：https://firebase.google.com/docs/cloud-messaging/js/receive

由于数据消息不支持fcm_options.link，建议您向所有数据消息添加通知有效内容。或者，您可以使用服务工作者处理通知。

有关通知消息和数据消息之间差异的说明，请参阅消息类型。

这是工作通知的JSON有效负载。 click_action用于处理点击。

{
  "data": {
    "badge": "23",
    "b": "xxxx",
    "t": "yyyy",
    "android_channel_id": "com.example.fcm"
  },
  "from": "11111111111",
  "notification": {
    "title": "Title",
    "body": "Body",
    "icon": "https://example.com/icon.png",
    "click_action": "https://example.com"
  },
  "collapse_key": "do_not_collapse"
}

Firebase Web推送通知，单击后不起作用

2 个答案: