未收到离子云推送GCM通知

时间:2016-09-29 23:11:10

标签: ionic-framework ionic-cloud

我不明白Ionic Cloud文档让这听起来很容易,但我似乎无法接收推送通知。它会在应用程序启动时进行注册,但之后将永远不会收到从Ionic Cloud仪表板发送的通知。我花了好几个小时试图找到一些我在文档中遗漏的关键词。我还审核了FAQ,并通过发送第二个通知来关闭应用程序,并且每次状态为sent时考虑了第二点,但是我说我仍然应该收到第一个通知在申请中。

我向所有用户发送通知,但我们没有使用Ionic Cloud Auth服务,因此我不确定通知是如何定向的,因为没有用户只是注册设备使用ionic run android加载应用程序。

使用Ionic 1.3.1的干净安装我已经完成了基于文档接收通知的最低限度,任何人都可以看到我可能出错的地方吗?它基本上是一个基本设置,带有一个控制器来监听通知。

按照Ionic docs的步骤进行操作。我完全重新编写应用程序只是为了使用这些确切的步骤来编写这个问题。

  1. npm install @ionic/cloud --save
  2. cp node_modules/@ionic/cloud/dist/bundle/ionic.cloud.min.js www/lib
  3. 将云JS文件添加到index.html,我将在下面发布
  4. 不需要蓝鸟承诺
  5. ionic io init在信息中心内创建应用,并在ionic.config.json中设置app_id,我将在下面发布
  6. 添加了配置块,我将在下面发布,并跳转到推送服务
  7. 由于某些问题,因为FCM在Ionic Cloud Dashboard中不可用,因此必须设置GCM
  8. 使用证书
  9. 中的Ionic Cloud仪表板为应用程序添加了安全配置文件
  10. 将GCM凭据添加到开发安全配置文件
  11. 使用phonegap-plugin-push添加了cordova plugin add phonegap-plugin-push --variable SENDER_ID=123456789011 --save,并且SENDER_ID位于config.xml,其中SENDER_ID是项目编号
  12. ionic.cloud添加为模块
  13. 的依赖项
  14. 添加了用于注册设备令牌的运行,我将在下面发布
  15. 创建一个临时控制器,仅用于测试,因为这是Angular 1.5,您现在可以创建一个组件,并在监听器上添加$ scope。$,我将在下面发布
  16. ionic run并将应用程序加载到我的手机上,当我在应用程序上运行检查器时,我可以看到它正在打开时注册并获得令牌
  17. 然后进入Ionic Cloud仪表板并发送一个从未收到的通知
  18. 注意: APP_ID,SENDER_ID,API_KEYS等都替换为此示例的随机等效数字

    的index.html

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    
        <!-- TODO: Add brand of application -->
        <title></title>
    
        <link rel="manifest" href="manifest.json">
    
        <!-- un-comment this code to enable service worker
        <script>
          if ('serviceWorker' in navigator) {
            navigator.serviceWorker.register('service-worker.js')
              .then(() => console.log('service worker installed'))
              .catch(err => console.log('Error', err));
          }
        </script>-->
    
    
        <!-- Compiled Styles -->
        <!-- inject:css -->
        <link href="css/ionic.app.css" rel="stylesheet">
        <!-- endinject -->
    
        <!-- Ionic Scripts -->
        <script src="lib/ionic/js/ionic.bundle.js"></script>
        <script src="lib/ionic.cloud.min.js"></script>
    
        <!-- Google Maps API -->
        <!--<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDOCZ0kgg2rTRzmGepWQMu6EM90koX4mUs&amp;libraries=places"></script>-->
    
        <!-- Vendor Scripts -->
        <!-- bower:js -->
        <!-- endbower -->
    
        <!-- Cordova Script (this will be a 404 during development) -->
        <script src="lib/ngCordova/dist/ng-cordova.js"></script>
        <script src="cordova.js"></script>
    
        <!-- Compiled Scripts -->
        <!-- inject:js -->
        <script src="js/app.module.js"></script>
        <script src="js/app.cloud.js"></script>
        <script src="js/app.config.js"></script>
        <script src="js/app.constants.js"></script>
        <script src="js/app.controller.js"></script>
        <!-- endinject -->
        <!-- inject:templates:js -->
        <!-- endinject -->
    </head>
    <body ng-app="app">
    
    <ion-pane>
        <ion-header-bar class="bar-stable" ng-controller="AppController">
            <h1 class="title">Ionic Blank Starter</h1>
        </ion-header-bar>
        <ion-content>
        </ion-content>
    </ion-pane>
    
    </body>
    </html>
    

    app.module.js

    (function () {
    
      'use strict';
    
      var dependencies = [
        'ionic',
        'ionic.cloud',
        'ngCordova'
      ];
    
      function run($ionicPlatform) {
    
        $ionicPlatform.ready(function () {
    
          if (window.cordova && window.cordova.plugins.Keyboard) {
    
            // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
            // for form inputs)
            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    
            // Don't remove this line unless you know what you are doing. It stops the viewport
            // from snapping when text inputs are focused. Ionic handles this internally for
            // a much nicer keyboard experience.
            cordova.plugins.Keyboard.disableScroll(true);
          }
    
          if (window.StatusBar) {
            StatusBar.styleDefault();
          }
        });
      }
    
      run.$inject = [
        '$ionicPlatform'
      ];
    
      angular
          .module('app', dependencies)
          .run(run);
    
    })();
    

    app.cloud.js

    (function () {
    
        'use strict';
    
        function config($ionicCloudProvider) {
    
            $ionicCloudProvider.init({
                'core': {
                    'app_id': '1234ab12'
                },
                'push': {
                    'sender_id': '123456789011',
                    'pluginConfig': {
                        'ios': {
                            'badge': true,
                            'sound': true
                        },
                        'android': {
                            'iconColor': '#343434',
                            'sound': true,
                            'vibrate': true
                        }
                    }
                }
            });
        }
    
        config.$inject = [
            '$ionicCloudProvider'
        ];
    
        function run($ionicPush) {
    
            // Register every time the application is opened so the device is
            // guaranteed to be registered and ready for notifications
            $ionicPush
                .register()
                .then(function (token) {
    
                    // Save the generated device token with the current user when
                    // the token is saved
                    return $ionicPush.saveToken(token);
                })
                .then(function (device) {
    
                    console.log('Device token:', device.token);
                });
        }
    
        run.$inject = [
            '$ionicPush'
        ];
    
        angular
            .module('app')
            .config(config)
            .run(run);
    
    })();
    

    ionic.config.json

    {
      "name": "v1.3",
      "app_id": "1234ab12",
      "gulpStartupTasks": [
        "sass",
        "watch"
      ],
      "watchPatterns": [
        "www/**/*",
        "!www/lib/**/*",
        "!www/**/*.map"
      ]
    }
    

    config.xml中

    <?xml version='1.0' encoding='utf-8'?>
    <widget id="com.ionicframework.v13169294" version="0.0.1" 
    
        // ...
    
        <plugin name="phonegap-plugin-push" spec="~1.8.2">
            <variable name="SENDER_ID" value="123456789011" />
        </plugin>
    </widget>
    

    .io.config.json

    {"app_id":"1234ab12","api_key":"e38rj3i3jsofp3098e8djksod92dmdow0ekdsj2930dk300f"}

    app.controller.js

    (function () {
    
        'use strict';
    
        function AppController($scope) {
    
            var vm = this;
    
            // ---
            // PUBLIC METHODS.
            // ---
    
            $scope.$on('cloud:push:notification', function (event, data) {
                var msg = data.message;
                alert(msg.title + ': ' + msg.text);
            });
    
            // ---
            // PRIVATE METHODS.
            // ---
        }
    
        AppController.$inject = [
            '$scope'
        ];
    
        angular
            .module('app')
            .controller('AppController', AppController);
    
    })();
    

1 个答案:

答案 0 :(得分:0)

好的,我在问题中设置的一切都是正确的。不正确的是Ionic Dashboard,它要求在安全配置文件中使用GCM API密钥,而事实证明您需要创建一个FCM项目并在GCM API密钥输入字段中使用Server密钥。

感谢Ionics论坛上的这篇文章 - https://forum.ionicframework.com/t/ionic-push-notification-for-android-keeps-giving-me-error-gcm-invalid-auth/63041/8

我还在Ionic Cloud的github repo上发布了一个问题 - https://github.com/driftyco/ionic-cloud-issues/issues/198#issuecomment-250856824