Не получение FCM Push-уведомления для web на localhost

поэтому мне нужно реализовать веб-уведомления толчка в нашем веб-приложении, я успешно настроил Firebase cloud messaging в своем приложении с помощью документов, я могу попросить пользователя разрешить разрешение на уведомления и получить идентификатор токена, а также, если он принимает разрешение.

дело в том, что когда я пытаюсь отправить уведомление для тестирования на сгенерированный токен, я получаю ответ, что сообщение отправлено, но я не могу получить его на клиенте сторона.

мой индекс.HTML-код 

<head>
  <script src="https://www.gstatic.com/firebasejs/4.4.0/firebase.js"></script>
  <link rel="manifest" href="./firebase.json">
</head>
 <script>
  if ('serviceWorker' in navigator) {
    navigator.serviceWorker.register('./firebase-messaging-sw.js').then(function(registration) {
      console.log('Firebase Worker Registered');

    }).catch(function(err) {
      console.log('Service Worker registration failed: ', err);
    });
  }
  </script>

я успешно могу зарегистрировать файл service worker

Мои Приложения.деталь.ТС

var config = {
            apiKey: "somekey",
            authDomain: "someproject-2.firebaseapp.com",
            databaseURL: "https://someproject-2.firebaseio.com",
            projectId: "someproject-2",
            storageBucket: "",
            messagingSenderId: "someid"
          };
          firebase.initializeApp(config);



        const messaging = firebase.messaging();

        messaging.requestPermission()
        .then(function() {
          console.log('Notification permission granted.');
          return messaging.getToken()
        })
        .then(function(result) {
            console.log("The token is: ", result);
        })
        .catch(function(err) {
          console.log('Unable to get permission to notify.', err);
        });

        messaging.onMessage(function(payload) {
        console.log("Message received. ", payload);
        });

Я получаю диалоговое окно разрешения с запросом разрешения и получаю токен с этим кодом

код curl, который я использовал для отправки сообщений

curl -X POST -H "Authorization: key=somekey" -H "Content-Type: application/json" -d '{
  "notification": {
    "title": "Portugal vs. Denmark",
    "body": "5 to 1",
    "icon": "firebase-logo.png",
    "click_action": "http://localhost:8081"
  },
  "to": "sometoken"
}' "https://fcm.googleapis.com/fcm/send"

Я могу успешно отправлять уведомления с помощью этого кода

Я не могу понять, где я ошибаюсь, может быть, потому, что это на localhost? может быть, метод onMessage работает неправильно? Любая помощь высоко ценится!

11
angular firebase-cloud-messaging javascript push-notification

3 ответов

у меня была аналогичная проблема, и я пошел в cloud messaging на firebase и получил свой ключ сервера и добавил Это к запросу curl.

curl --header  "Authorization: key=CloudMessagingServerKey" --header  "Content-Type: application/json" -d '{
     "notification": {
        "title": "FCM Message",
        "body": "This is an FCM Message",
      },
     "to": "token from messaging.getToken()"
     }' "https://fcm.googleapis.com/fcm/send"

и меня firebase-messaging-sw.js выглядел как код ниже

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

firebase.initializeApp({
  apiKey: 'yourapikey',
  authDomain: 'xxxx.firebaseapp.com',
  databaseURL: 'https://xxxx.firebaseio.com',
  projectId: 'xxxx',
  storageBucket: 'xxxx.appspot.com',
  messagingSenderId: 'your message sender Id',
});

const messaging = firebase.messaging();

что сделал трюк для меня. Мои ошибки были я использовал неправильный serverKey и я не использовал importScripts в моем firebase-messaging-sw.js

7

хорошо, я не получил никаких ответов на это на stackoverflow, поэтому я должен сделать это самостоятельно и заставить его работать!

проблема была в файле service worker, я, по-видимому, не определил переменную обмена сообщениями.

Если кто-то сталкивается с этой проблемой, просто убедитесь, что ваш файл service worker выглядит примерно так.

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

firebase.initializeApp({
    'messagingSenderId': '182145913801'
  });

const messaging = firebase.messaging();
2

Как указано на веб-сайте FCM:

FCM SDK поддерживается только на страницах, обслуживаемых через HTTPS. Это связано с его использованием сервисных работников, которые доступны только на сайтах HTTPS.

см.https://firebase.google.com/docs/cloud-messaging/js/client

-3