消息传递/不正确-gcm-sender-id firebase PWA答案

【问题标题】：messaging/incorrect-gcm-sender-id firebase PWA消息传递/不正确-gcm-sender-id firebase PWA
【发布时间】：2018-09-24 14:08:37
【问题描述】：

我做了一个 PWA，现在我正在寻找添加通知。我想使用 Cloud Messaging (Firebase)，但遇到了一些问题。我遵循了一个教程，我在 manifest.json 中添加了这一行：

"gcm_sender_id": "My sender ID".

在我的 index.html 中我添加了

<script src = "https://www.gstatic.com/firebasejs/4.1.1/firebase-app.js">
</ script>
<script src = "https://www.gstatic.com/firebasejs/4.1.1/firebase-messaging.js"> <script>
    var config = {
        apiKey: "My api",
authDomain: "example.firebaseapp.com",
databaseURL: "https://example.firebaseio.com",
projectId: "example",
storageBucket: "example.appspot.com",
messagingSenderId: "My sender ID"

    };
    firebase.initializeApp (config);
    const messaging = firebase.messaging ();
 messaging
.requestPermission ()
then (function () {
 console.log ("Notification permission granted.");
 return messaging.getToken ();
})
.then (function (token) {
console.log ("token is:" + token);
})
.catch (function (err) {
console.log ("Unable to get permission to notify.", err);
});
</ Script>

这样，我得到以下错误：

消息：请将您的网络应用清单“gcm_sender_id”值更改为“103953800507”以使用 Firebase 消息。（消息/不正确-gcm-sender-id）

我搜索了一下，在 github (https://github.com/realtime-framework/WebPushNotifications) 上他们说要通过控制台中写入的内容更改 SENDER ID

所以我修改了 manifest.json 并收到以下错误

获取脚本时收到错误的 HTTP 响应代码 (404)。加载资源失败：net :: ERR_INVALID_RESPONSE /firebase-messaging-sw.js

消息：我们无法注册默认服务工作者。”无法注册服务工作者：获取脚本时收到错误的 HTTP 响应代码 (404)。（消息/失败的服务工作者注册）。

我找不到我要做什么，我承认有点失落。

【问题讨论】：

标签： javascript push-notification firebase-cloud-messaging progressive-web-apps

【解决方案1】：

现在您必须将另一个名为“firebase-messaging-sw.js”的文件添加到您的根目录，它可以是空文件。它可能会修复错误。但是您需要稍后更新此文件，您将在接下来的 firebase 消息传递实施步骤中知道。

【讨论】：

【解决方案2】：

对于遇到此问题的任何人，就像我一样，这就是我放入文件中的内容

self.addEventListener('push', function(event) {
  console.log('[Service Worker] Push Received.');
  //console.log(`[Service Worker] Push had this data: "${event.data.text()}"`);

  const title = 'Push Codelab';
  const options = {
    body: 'Yay it works.',
    icon: 'images/icon.png',
    badge: 'images/badge.png'
  };

  event.waitUntil(self.registration.showNotification(title, options));
});



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


  var firebaseConfig = {
    apiKey: "****",
    authDomain: "****",
    projectId: "****",
    storageBucket: "****",
    messagingSenderId: "****",
    appId: "****",
    measurementId: "****"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  //firebase.analytics();

if (firebase.messaging.isSupported()) {
  firebase.messaging();
  console.log('FB Messaging Supported');
}


  const messaging = firebase.messaging();
messaging.onBackgroundMessage((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: '/firebase-logo.png'
  };

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

将 **** 替换为 firebase 仪表板中您自己的数据

【讨论】：