无托管的 Firebase 云消息传递 (Web/JavaScript)答案

【问题标题】：Firebase Cloud Messaging without hosting (Web/JavaScript)无托管的 Firebase 云消息传递 (Web/JavaScript)
【发布时间】：2018-06-27 17:34:43
【问题描述】：

在阅读 Firebase 云消息传递的官方视频教程时，我无法在没有托管应用程序的情况下获得消息传递令牌。

这是我的app.js 文件：

/* global firebase */

// Initialize Firebase
var config = {
  apiKey: 'AIzaSyBYfb9HAi_oE-PKqFNkRQcxAgLU-nm8sIE',
  authDomain: 'web-quickstart-c0309.firebaseapp.com',
  databaseURL: 'https://web-quickstart-c0309.firebaseio.com',
  projectId: 'web-quickstart-c0309',
  storageBucket: 'web-quickstart-c0309.appspot.com',
  messagingSenderId: '713880824056'
}
firebase.initializeApp(config)

const messaging = firebase.messaging()
messaging.requestPermission()
  .then(() => {
    console.log('Permission granted.')
    return messaging.getToken()
      .then(token => {
        console.log('messaging token test:', token)
        return token
      })
      .catch(error => {
        console.log('messaging error:', error)
      })
  })
  .then(token => {
    console.log('permission token test:', token)
  })
  .catch(error => {
    console.log('permission error:', error)
  })

我的根目录中有一个firebase-messaging-sw.js 文件。

当我直接在浏览器中加载index.html 文件并接受对话框时，我收到一个未定义的令牌值。完整的控制台输出是：

16:20:35.744 app.js:17 Permission granted.
16:20:35.750 app.js:20 messaging token test: null
16:20:35.751 app.js:28 permission token test: null

如果我通过编辑 firebase.json 文件来托管应用程序以读取：

{
  "hosting": {
    "public": "./"
  }
}

然后运行firebase serve -p 8081，打开http://localhost:8081，并接受对话框，我确实收到了一个令牌。完整的输出是：

16:23:42.902 app.js:17 Permission granted.
16:23:43.059 app.js:20 messaging token test: eyd1EaFwULQ:APA91bGUZr9fAGcCaYVtXTPjk55AmpWLNdaqGapMa1S1GWTYeJwtJraEKuhAPpSM-v-2xPaSJQgTKRVosTN-0KRPHCccjdRZNDkegtW2HMC_mSbdap9h5TeH7KKQSbN4QrjVmIl7VZlu
16:23:43.060 app.js:28 permission token test: eyd1EaFwULQ:APA91bGUZr9fAGcCaYVtXTPjk55AmpWLNdaqGapMa1S1GWTYeJwtJraEKuhAPpSM-v-2xPaSJQgTKRVosTN-0KRPHCccjdRZNDkegtW2HMC_mSbdap9h5TeH7KKQSbN4QrjVmIl7VZlu

这是一个记录的约束吗？有没有办法在不托管应用程序的情况下接收令牌？

【问题讨论】：

本地主机是否在您的 Firebase 控制台设置中是一个已批准的域？

标签： javascript firebase firebase-cloud-messaging

【解决方案1】：

FCM 仅适用于 https 协议提供的页面

如document

仅在通过 HTTPS 提供的页面中支持 FCM SDK。这个到期了对其使用服务工作人员，这些服务工作人员仅在 HTTPS 上可用网站。需要提供者吗？ Firebase 托管是一种免费的简单方法 HTTPS 托管在您自己的域上。

如果您想知道为什么 localhost 会这样工作，因为 localhost 中的页面就像它们由 https 提供的一样工作

所以 有没有办法在不托管应用程序的情况下接收令牌？

答案是否您的页面应该由 https 协议提供服务

【讨论】：

我快疯了，希望你能知道答案。在同一教程中，该人在firebase-messaging-sw.js 服务工作者中使用importScripts()，但importScripts() 未定义。 Stack 说它只适用于工人。教程中的这个人说他的应用程序是基本的，只是一个 HTML 页面。他如何使用importScripts()？
这是教程，与原始海报firebase.google.com/docs/cloud-messaging/js/client 相同，一开始他介绍了他正在使用的应用程序。 3:38 他使用importScripts()

【解决方案2】：

我不会说这是确切的替代方案，而是问题的替代解决方案，您可以使用 ngrok ，它将为您提供 Https 访问以替代表示 localhost 的方式。

所以在安装后使用它从 FCM 中的 ngrok 在终端上输出的任何 URL。

注意：ngrok 输出 http 和 https URL，所以只使用 Https 。它们仍然映射到您的本地服务器。

【讨论】：