ionic2实战-极光推送

传送门

极光官网

极光开发者控制台

jpush-phonegap-plugin

jpush 通用API

jpush Android API

jpush Ios API

准备

注册并登录极光官网创建一个应用

生成AppKey AppKey一会用来安装插件

推送设置 android设置,填写应用包名点击提交.(包名是app根目录下congfig.xml中的id值) ios设置本文后面会讲

安装插件

1.使用命令安装

cordova plugin add jpush-phonegap-plugin --variable APP_KEY=你的AppKey

命令安装插件过程如下图,会安装jpush-phonegap-plugin和cordova-plugin-jcore两个插件,这两个插件大概有19M,如果网络慢就使用本地安装

2.本地安装

去github上下载cordova-plugin-jcore和jpush-phonegap-plugin到本地

下载后解压到某目录,如我解压到D盘根目录,安装过程如下图

插件安装完成,依次执行下面命令,build app看插件是否报错

cordova platform rm android

cordova platform add android

ionic cordova build android

项目中集成推送功能

如下图,创建一个类并添加初始化极光推送代码.我创建的类名叫Helper.ts你随意

Helper.ts完整代码

最新代码可参考Helper.ts

/**

* Created by [email protected] on 05-09.

import {Injectable} from '@angular/core';

import {NativeService} from "./NativeService";

/**

* Helper类存放和业务有关的公共方法

* @description

@Injectable()

export class Helper {

constructor(private nativeService: NativeService) {

}

initJpush() {

if (!this.nativeService.isMobile()) {

return;

}

window['plugins'].jPushPlugin.init();

if (this.nativeService.isIos()) {

window['plugins'].jPushPlugin.setDebugModeFromIos();

window['plugins'].jPushPlugin.setApplicationIconBadgeNumber(0);

} else {

window['plugins'].jPushPlugin.setDebugMode(true);

window['plugins'].jPushPlugin.setStatisticsOpen(true);

}

this.jPushAddEventListener();

}

private jPushAddEventListener() {

//判断系统设置中是否允许当前应用推送

window['plugins'].jPushPlugin.getUserNotificationSettings(result => {

if (result == 0) {

console.log('系统设置中已关闭应用推送');

} else if (result > 0) {

console.log('系统设置中打开了应用推送');

}

});

//点击通知进入应用程序时会触发的事件

document.addEventListener("jpush.openNotification", event => {

let content = this.nativeService.isIos() ? event['aps'].alert : event['alert'];

console.log("jpush.openNotification" + content);

}, false);

//收到通知时会触发该事件

document.addEventListener("jpush.receiveNotification", event => {

let content = this.nativeService.isIos() ? event['aps'].alert : event['alert'];

console.log("jpush.receiveNotification" + content);

}, false);

//收到自定义消息时触发这个事件

document.addEventListener("jpush.receiveMessage", event => {

let message = this.nativeService.isIos() ? event['content'] : event['message'];

console.log("jpush.receiveMessage" + message);

}, false);

//设置标签/别名回调函数

document.addEventListener("jpush.setTagsWithAlias", event => {

console.log("onTagsWithAlias");

let result = "result code:" + event['resultCode'] + " ";

result += "tags:" + event['tags'] + " ";

result += "alias:" + event['alias'] + " ";

console.log(result);

}, false);

}

//设置标签

public setTags() {

if (!this.nativeService.isMobile()) {

return;

}

let tags = this.nativeService.isAndroid() ? ['android'] : ['ios'];

console.log('设置setTags:' + tags);

window['plugins'].jPushPlugin.setTags(tags);

}

//设置别名,一个用户只有一个别名

public setAlias(userId) {

if (!this.nativeService.isMobile()) {

return;

}

console.log('设置setAlias:' + userId);

//ios设置setAlias有bug,值必须为string类型,不能是number类型

window['plugins'].jPushPlugin.setAlias('' + userId);

}

注意:极光推送最新版设置别名方法有所改变.本文使用的方法是旧版.详情请看:https://github.com/jpush/jpush-phonegap-plugin/blob/master/doc/Common_detail_api.md#setalias如下图,在app.component.ts调用初始化推送方法(点击图片放大看)