未收到离子云推送 GCM 通知

Question

我不明白 Ionic Cloud 文档使这听起来如此简单，但我似乎无法接收推送通知。它在应用程序启动时进行注册，但之后从未收到从 Ionic Cloud 仪表板发送的通知。我花了几个小时试图找到我在文档中遗漏的一些关键词。我还查看了 FAQ，并通过在应用程序关闭时发送第二个通知来考虑第二点，每次状态都是 sent，但那表示我仍然应该收到第一个通知在申请中。

我正在向所有用户发送通知，但我们没有使用 Ionic Clouds Auth 服务，所以我不确定通知是如何发送的，因为没有用户只是一个已加载应用程序的注册设备使用 ionic run android.

使用 Ionic 1.3.1 的全新安装，我已经做了最低限度的工作以根据文档接收通知，任何人都可以看到我可能哪里出错了吗？它基本上只是带有控制器的基本设置来侦听通知。

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

npm install @ionic/cloud --save
cp node_modules/@ionic/cloud/dist/bundle/ionic.cloud.min.js www/lib
将云JS文件添加到index.html，我将在下面post)
不需要蓝鸟的承诺
ionic io init 在仪表板中创建应用程序，并在 ionic.config.json 中设置 app_id，我将在下面 post
添加了配置块，我将在下面post，并跳转到推送服务
由于某些问题，FCM 在 Ionic Cloud Dashboard 中不可用，因此必须设置 GCM
在证书中使用 Ionic Cloud 仪表板向应用程序添加了安全配置文件
将 GCM 凭据添加到开发安全配置文件中
使用 cordova plugin add phonegap-plugin-push --variable SENDER_ID=123456789011 --save 添加 phonegap-plugin-push，并检查 SENDER_ID 在 config.xml 中，其中 SENDER_ID 是项目编号
添加 ionic.cloud 作为对模块
添加了运行用于注册设备令牌，我将在下面 post
创建了一个仅用于测试的临时控制器，因为这是 Angular 1.5，您现在可以创建一个组件，并添加 $scope.$on 侦听器，我将在下面 post
运行 ionic run 并将应用程序加载到我的 phone，当运行ning inspector 在应用程序上时，我可以看到它正在注册打开，我得到一个令牌
然后进入 Ionic Cloud 仪表板并发送通知，但从未收到

注意： 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);

})();

Answer 1

好的，我在问题中设置的所有内容都是正确的。不正确的是 Ionic 仪表板，它要求在安全配置文件中使用 GCM API 密钥，而事实证明您需要创建一个 FCM 项目并使用 GCM API 中的服务器密钥] 键输入字段。

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

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

未收到离子云推送 GCM 通知

Ionic Cloud Push GCM Notifications Not Received

ionic-framework

ionic-cloud