Skip to content

ionic快速集成极光推送

Jump to bottom
dicallc edited this page Jan 29, 2018 · 1 revision

1.到极光官网注册账号，新建应用获得appkey。

详见：极光官网

相信在这一步应该没什么问题，注册帐号需要公司名称，应该可以随便写，当然也可以填你公司名称。随后创建应用就可以得到key

2.找文档哟，找文档

关于极光插件使用文档地址

一直觉得既然官方有文档，就按照文档来，如果有坑我就记录下来~顺便安利一下，谷歌的开发文档是写得最好的，如果你们有机会体验的话~

2.1接着我们是应该关于PhoneGap 的插件

PhoneGap 的插件文档地址：

3 通过 Cordova Plugins 安装

  • 通过 Cordova Plugins 安装，要求 Cordova CLI 5.0+：
    cordova plugin add jpush-phonegap-plugin --variable APP_KEY=your_jpush_appkey
  • 或直接通过 url 安装：
    cordova plugin add https://github.com/jpush/jpush-phonegap-plugin.git --variable APP_KEY=your_jpush_appkey
  • 或下载到本地安装：
    cordova plugin add Your_Plugin_Path --variable APP_KEY=your_jpush_appkey

APPKEY(yourjpush_appkey)也就是我上图中打马克的位置,因为网络问题，家里的垃圾网络三个都失效了

回到公司重新试了下

接着遇到报错...无数个错，最后把node_modules删除调后用，不用cnpm下载，用npm下载

成功！报错的可以仔细看看错误，大多数是跟node_modules报错有关，试试我这种办法

4.开始写代码

配置十小时，代码一分钟....真心费功夫，说不定下次换台电脑又用不了

html代码

<button ion-button block (click)="initJPush()">启动推送</button>
<ion-item>
  <ion-label floating>别名 Alias</ion-label>
  <ion-input type="text" [(ngModel)]="alias"></ion-input>
</ion-item>
<button ion-button block (click)="setAlias()" [disabled]="alias == ''">设置别名</button>

<ion-list>
<ion-item text-wrap *ngFor="let msg of msgList">
<ion-avatar item-left>
<img src="assets/user.jpg">
</ion-avatar>
<h2>通知</h2>
<p>{{msg.content}}</p>
</ion-item>
</ion-list>

ts代码

declare var window; //这一句话非常重要记得加上

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


import { NavController } from 'ionic-angular';
declare var window;
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
alias: string = '';
msgList:Array=[];
constructor(public navCtrl: NavController) {


}
initJPush() {
//启动极光推送
if (window.plugins && 　window.plugins.jPushPlugin) {
window.plugins.jPushPlugin.init();
document.addEventListener("jpush.receiveNotification", () => {
this.msgList.push({content:window.plugins.jPushPlugin.receiveNotification.alert})
}, false);
}
}
setAlias() {
//设置Alias
if (this.alias && this.alias.trim() != '') {
window.plugins.jPushPlugin.setAlias(this.alias);
}else alert('Alias不能为空')
}
}

5.运行

ionic cordova run android

这里需要下载gradle3.3,如果网络没问题，一般没什么问题，启动apk后，记得点击一下启动推送,然后在极光推送发一下推送就行了

6.关于推送的一些事

在ios和android中，推送是很难达到及时推送率，而对于安卓不同的厂商定制系统中，推送不一定能收到也是很正常的

如果有很多关于推送的问题 建议去官方github去提issue

ionic极光插件github地址

参考：Ionic2中使用第三方插件极光推送

Clone this wiki locally