javascript - polymer 铂金推送消息元件

Question

我正在尝试弄清楚如何使用 polymer <platinum-push-messaging>元素，但没有运气。在该元素的文档中，它说您需要注册您的“gcm_sender_id”，然后定义该元素本身，如下所示:

<platinum-push-messaging
   title="Application updated"
   message="The application was updated in the background"
   icon-url="icon.png"
   click-url="notification.html">
</platinum-push-messaging>

为了测试它，有一个方法叫做 testPush(message)但它总是返回以下错误:

platinum-push-messaging.html:437 Uncaught (in promise) TypeError: Cannot read property 'active' of undefined(…)

我不知道我是不是忘记了什么，还有 Cat Push Notifications project根本没有帮助，我无法让它工作...

谁能指出我正确的方向？？

Answer 1

platinum-push-messaging 元素可用于使用 gcm_sender_id(GCM 代表 Google Cloud Messaging)订阅推送通知。

如果您在 Firebase 上托管您的项目，您可以在 Console 中找到您的 gcm_sender_id您的项目 > 项目设置 > 云消息传递。

否则您可以在 Google Developers Console 中创建一个项目并在设置中找到 ID(项目编号)。

注意:由于 Docs 中的要求部分，推送消息目前仅在 Google Chrome 中可用。

但让我们逐步演示(适用于 MAC 和 UNIX - 这就是官方演示所支持的):

1. 创建一个新文件夹并在其中打开一个终端
2. 运行 bower init(对于 bower.json)
3. 运行bower install PolymerElements/paper-elements(我们将使用的官方演示使用的元素)
4. 运行 bower install PolymerElements/platinum-push-messaging(您将获得包含演示所需的所有内容的 bower_components 文件夹)
5. 获取the offical demo对于 platinum-push-messaging 和 manifest.json (将这些文件复制到您刚刚创建的文件夹中)

6. 在index.html中将6个rel="imports"改成中对应元素的.html文件bower_components 和 webcomponents 包含到 bower_components/webcomponentsjs/webcomponents-lite.min.js。导入应该看起来像这样:

   <script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
   <link rel="import" href="bower_components/paper-styles/paper-styles.html">
   <link rel="import" href="bower_components/paper-styles/classes/global.html">
   <link rel="import" href="bower_components/paper-item/paper-item.html">
   <link rel="import" href="bower_components/paper-material/paper-material.html">
   <link rel="import" href="bower_components/paper-toggle-button/paper-toggle-button.html">
   <link rel="import" href="bower_components/platinum-push-messaging/platinum-push-messaging.html">
   <link rel="manifest" href="manifest.json">
   

7. 转到 Google Developers Console并创建一个项目。

8. 选择“管理所有项目”、“设置”，选择您的项目并复制“项目编号”
9. 打开manifest.json并将gcm_sender_id设置为复制的号码。
10. 返回 Google Developers Console并打开“API Manager”(左侧栏)、“Credentials”
11. 创建一个新的凭据服务器 key 并复制 API key (您将在后面的步骤中需要它，因此将其保存在 .txt 或类似文件中)<
12. 打开“库”并点击“Google Cloud Messaging”，然后点击启用(屏幕顶部)。
13. 运行 polymer serve --open
14. 单击 paper-toggle-button 启用推送消息(如果当前订阅未显示任何内容，请尝试禁用并重新启用它)
15. 复制paper-material底部的curl命令
16. 将命令粘贴到您的终端并将 [YOUR_PUBLIC_API_KEY] 替换为您在第 11 步中复制的 API key
17. 当您运行该命令时，您应该会收到一条推送消息!

注意:如果您在 Google Developers Console 中查找内容时遇到问题，可以使用 great Tutorial .