我不明白 Ionic Cloud 文档让这听起来很容易,但我似乎无法接收推送通知。它会在应用程序启动时进行注册,但之后再也不会收到从 Ionic Cloud 仪表板发送的通知。我花了几个小时试图找到我在文档中遗漏的一些关键词。我还查看了常见问题解答,并通过在应用程序关闭时发送第二个通知来考虑第二点,每次状态为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,我将在下面发布)
- 不需要蓝鸟的承诺
ionic io init
在仪表板中创建应用程序,并在中设置 app_idionic.config.json
,我将在下面发布- 添加了配置块,我将在下面发布,并跳转到推送服务
- 由于某些问题,FCM 在 Ionic Cloud Dashboard 中不可用,因此必须设置 GCM
- 使用证书中的 Ionic Cloud 仪表板向应用程序添加了安全配置文件
- 将 GCM 凭据添加到开发安全配置文件
- 添加
phonegap-plugin-push
usingcordova plugin add phonegap-plugin-push --variable SENDER_ID=123456789011 --save
,并选中SENDER_ID
is inconfig.xml
,其中 SENDER_ID 是项目编号 - 添加
ionic.cloud
为模块的依赖项 - 添加了注册设备令牌的运行,我将在下面发布
- 创建了一个临时控制器仅用于测试,因为这是 Angular 1.5,您现在可以创建一个组件,并添加 $scope.$on 监听器,我将在下面发布
- 运行
ionic run
并将应用程序加载到我的手机上,当在应用程序上运行检查器时,我可以看到它正在打开注册并且我得到一个令牌 - 然后在 Ionic Cloud 仪表板上发送通知,但从未收到
注意:本示例中的 APP_ID、SENDER_ID、API_KEYS 等都被替换为随机等效数字
索引.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&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"
]
}
配置文件
<?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);
})();