FireBase Web Push изображения, значок, действие и вибрация не работают - PullRequest
Новая
       40

FireBase Web Push изображения, значок, действие и вибрация не работают

0 голосов
/ 16 марта 2019

Я пытался реализовать Firebase Web Push-уведомления на моем сайте. Я попытался отправить образец веб-push-сообщения от Postman со значениями ниже:

URL: https://fcm.googleapis.com/fcm/send

заголовок: 

Content-Type : "application/json";
  Authorization: key=<myKey>

метод: POST

тело запроса: 

{
 "to" : "cw3K5GEx01c:APA91bG2DA-ljONHngS47SxVAjY9ueLaV2sT9ssWBALha3ycZJo0scpSm9yJDxQE_WVWCr0BepMVyyrg-s_ggxI7izsoUR5sIy_1NMT72N_636U3m2yJnmACNMTLL7zUZ5BrkmyHV3v2",
 "notification" : {
 "body" : "great match!",
 "title" : "Portugal vs. Denmark",
 "icon": "https://firebasestorage.googleapis.com/v0/b/fcm-on-web.appspot.com/o/icons8-notification-96(1).png?alt=media",
 "click_action": "https://fcm-on-web.firebaseapp.com",
 "content_available" : true,
 "priority" : "high"
 },
        "badge": "https://firebasestorage.googleapis.com/v0/b/fcm-on-web.appspot.com/o/icons8-notification-24.png?alt=media",
        "actions": [
          {
            "action": "yes",
            "title": "Yes",
            "icon": "images/yes.png"
          },
          {
            "action": "no",
            "title": "No",
            "icon": "images/no.png"
          }
        ],
        "tag": "something",
        "image": "https://firebasestorage.googleapis.com/v0/b/fcm-on-web.appspot.com/o/_%2B91 90726 44297_ 20180910_134125.jpg?alt=media",
 "data" : {
 "body" : "great match!",
 "title" : "Portugal vs. Denmark",
 "content_available" : true,
 "priority" : "high"
 } 
}

А содержимое файла firebase-messaging-sw.js выглядит следующим образом: 

 // 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('/__/firebase/5.5.6/firebase-app.js');
importScripts('/__/firebase/5.5.6/firebase-messaging.js');
importScripts('/__/firebase/init.js');

// 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
    var notificationTitle = 'Message Title, hardcoded inside service-worker';
    return self.registration.showNotification(notificationTitle,
      {
        badge: "https://firebasestorage.googleapis.com/v0/b/fcm-on-web.appspot.com/o/icons8-notification-24.png?alt=media",
        actions: [
          {
            "action": "yes",
            "title": "Yes",
            "icon": "images/yes.png"
          },
          {
            "action": "no",
            "title": "No",
            "icon": "images/no.png"
          }
        ],
        tag: "something",
        image: "https://firebasestorage.googleapis.com/v0/b/fcm-on-web.appspot.com/o/_%2B91 90726 44297_ 20180910_134125.jpg?alt=media"
      });
  });

В некоторых документах Google говорится, что мне не нужно указывать заголовок, тело и значок уведомления в сервисном работнике, если он явно отображается в теле запроса почтальона. Как и в этом документе, заголовок, тело и значок уведомления находятся там, где и должны быть. Но даже когда я дал действительные значения для полей изображения, значка, действия и вибрации как в теле запроса почтальона, так и в сервисном сервисе, эти четыре функции веб-push не работают для моего случая. Я использую как Firebase хостинг, облачные функции и облачные сообщения для моего проекта. Вот содержимое файла index.js облачных функций: 

const functions = require('firebase-functions');
const admin = require("firebase-admin");

const express = require('express');
const bodyParser = require("body-parser");


const app = express();
const firebaseApp = admin.initializeApp(
    functions.config().firebase
)


app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json())

app.get('/sendPush/:id', (req, res) => {
    res.send(`
        <html>
            <head>
                <title>
                    Push List
                </title>
            </head>
            <body>
                <h1>List Of Recent Push Messages</h1>
            </body>
        </html>
    `);
});
app.post('/sendPush', (req, res) => {

    firebaseApp
        .messaging()
        .send({
            "token" : "e29EjTpwmmY:APA91bHRGY8ihyBl9tnYVIP4RCVLbLpg4zwFEmHvdxhcfy5c7AM3EkbAl29nLSc009oIA4ZiTm9dLqMsz3-rXtn2IEA7_epHSwRxldykNW9Aw_ClncYUSQW7BHB3m2HjSfSBdy02BfXa",
            "notification" : {
                "body" : "great match!",
                "title" : "Portugal vs. Denmark",
                "icon": "https://img.icons8.com/nolan/64/000000/minecraft-creeper.png",
                "click_action": "http://localhost:5000",
                "content_available" : "true",
                "priority" : "high"
                },
            "data" : {
            "body" : "great match!",
            "title" : "Portugal vs. Denmark",
            "content_available" : "true",
            "priority" : "high"
            } 
           })
        .then(result => {
            console.log(result);
            res.send(result)
        })
        .catch(err => {
            console.log(err);
            res.send(err)
        });



});
app.put('/sendPush/:id', (req, res) => res.send(req.body));
app.delete('/sendPush/:id', (req, res) => res.send(req.params.id));
app.get('/sendPush/', (req, res) => res.send(req.params));

редактирование: Если я добавлю приведенный ниже код в работника службы и заменим тело почтальона на второй код ниже, уведомление будет работать с заголовком, телом и действиями, жестко закодированными внутри работника службы. firebase-сообщения-sw.js: 

importScripts('/__/firebase/5.5.6/firebase-app.js');
importScripts('/__/firebase/5.5.6/firebase-messaging.js');
importScripts('/__/firebase/init.js');

const messaging = firebase.messaging();

messaging.setBackgroundMessageHandler(function(payload) {
  console.log('[firebase-messaging-sw.js] Received background message ', payload);
  // Customize notification here
  var notificationTitle = 'Background Message Title';
  var notificationOptions = {
    body: 'Background Message body.',
    icon: '/firebase-logo.png',
    actions: [
      {
        "action": "yes",
       "title": "Yes",
       "icon": "images/yes.png"
     },
     {
       "action": "no",
       "title": "No",
       "icon": "images/no.png"
     }
       ]
  };

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

и тело почтальона: 

{
 "to" : "exK2dzY0-HY:APA91bFroNju11PkRhFZb56ZkX7nj0QeQfWAhu_xTmNGxmiUZXZPpyomXz1DHohDo3MJgJS6dI6Bayk2mpQJVgdihVBPYYQGI0D6Xcxr1GFmXBgeMQ3W46rczQw40XBtHypeiTymKb_g",
 "notification" : {
 },
 "data" : {
 "body" : "great match!",
 "title" : "Portugal vs. Denmark",
 "content_available" : true,
 "priority" : "high",
    "custom_data": "Hey yo !"
 } 
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...