logo标签列表

如何从 Ionic 移动应用程序发送/接收推送通知？

androidcordovapush-notificationionic-framework
13
我有一个使用 Ionic 框架（在 cordova 上）构建的消息应用程序。我计划将其构建为适用于 Android 的应用程序，并希望通过 JavaScript/Ionic 实现推送通知的发送和接收。
是否有任何好的教程介绍如何设置这样的功能？
如果您想的话，可以参考devgirl的最新博客文章：http://devgirl.org/2014/12/16/push-notifications-sample-app-with-ionic-and-ngcordova/。 - T.Baba
4个回答
15

有一个由 Holly Schinsky 提供的示例应用程序，其核心是使用PushPlugin，这是处理 Cordova 上推送通知的标准方法。在该GitHub存储库的文档中提供了相当详尽的教程。主要方法是pushNotification.register，用于注册设备以侦听推送通知。

如果您需要触发本地通知，您可能需要查看Local notification plugin。使用它，您可以添加要在设备上显示的通知，而无需使用外部服务来发送推送通知。

5

使用此插件https://github.com/phonegap-build/PushPlugin。

Android设备通过Google Cloud Messaging（GCM）服务接收推送通知，而iOS设备则从Apple推送通知（APN）服务中接收通知。

通知的接收方式（声音、提醒等）是应用程序在注册时设置的选项与用户设备上的通知设置的组合。

如果您想要更具体的信息，请参考下面的教程：http://devgirl.org/2013/07/17/tutorial-implement-push-notifications-in-your-phonegap-application/

2
最新的phonegap-plugin-push插件允许您在ionic应用中注册和接收推送通知。它的维护链接如下：https://github.com/phonegap/phonegap-plugin-push 安装方法： 
cordova plugin add https://github.com/phonegap/phonegap-plugin-push --variable SENDER_ID="XXXXXXX"

在SENDER_ID="XXXXXXX"中的XXXXXXX映射到Google开发者控制台中的项目编号。要查找项目编号，请登录Google开发者控制台，选择您的项目，并单击下面截图中的菜单项以显示您的项目编号。 zzns8 如果您不创建Android应用程序，则可以为此值输入任何内容。
注意：您可能需要在package.json中指定SENDER_ID变量。
"cordovaPlugins": [
    {
      "variables": {
        "SENDER_ID": "XXXXXXX"
      },
      "locator": "phonegap-plugin-push"
    }
  ]

注意：如果您计划使用prepare方法安装/恢复插件，您需要在config.xml中指定SENDER_ID变量。否则，prepare方法将跳过安装插件的步骤。

<plugin name="phonegap-plugin-push" spec="1.6.0">
    <param name="SENDER_ID" value="XXXXXXX" />
</plugin>

安装完成后，您现在可以将以下代码添加到主JavaScript文件中，以注册并接收推送通知：
    $ionicPlatform.ready(function () {

         var push = PushNotification.init({
           android: {
             senderID: "XXXXXXX"//, //project token number (12 digit) from https://console.developers.google.com
             // forceShow: "true", //force show push notification when app is in foreground on Android only.
           },
           browser: {
             pushServiceURL: 'http://push.api.phonegap.com/v1/push'
           },
           ios: {
             /*senderID: "XXXXXXX",*/ //If using GCM for ios, project token number (12 digit) from https://console.developers.google.com
             /*gcmSandbox: 'true',*/ //If using GCM for ios
             alert: 'true',
             badge: 'true',
             sound: 'true',
           },
           windows: {}
         });

         PushNotification.hasPermission(function (permissionResult) {
           if (permissionResult.isEnabled) {
             $log.debug("has permission for push notification");

             /*Register device with GCM/APNs*/
             push.on('registration', function (data) {
               // data.registrationId
               $log.debug("data.registrationId: " + data.registrationId);          
             });

             push.on('notification', function (data) {
               // data.message,
               // data.title,
               // data.count,
               // data.sound,
               // data.image,
               // data.additionalData
               $log.debug(JSON.stringify(data));
             });

             push.on('error', function (e) {
               // e.message
               $log.debug("e.message: " + e.message);
               //alert(e.message);
             });
           }
         });
       }
     }
如何注入这个，因为我尝试了但是显示错误，提示 .init 未定义。 - Pedro Miguel Pimienta Morales
@Pedro Miguel Pimienta Morales，你在浏览器上还是设备上遇到了“未定义.init”错误？该插件仅适用于设备。为了在浏览器上停止出现错误，您可以将调用包装在“if（window.cordova）{}”条件中。 - Ian Pinto
"locator": "phonegap-plugin-push" 的意思是必要的。 - Pedro Miguel Pimienta Morales
2
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接