Ionic JPush极光推送插件实例

1.需要去这里注册https://www.jiguang.cn

注册成功获取AppKey

备注填写应用包名规范点，在项目还要用那

2.创建ionic 项目指定你注册时候的包名(假如：com.ionicframework.ltapp)

ionic start -i com.ionicframework.ltapp ltapp blank

3.添加JPush 插件

进入项目目录下 cd ltapp

git clone https://github.com/jpush/jpush-phonegap-plugin.git

cordova 添加jpush

cordova plugin add $dir\jpush-phonegap-plugin --variable API_KEY=you key

备注：you key =注册成功获取AppKey $dir=当前插件所在位置添加完成，去项目下面plugins =》plugin.xml 文件查看这个节点是否和你appkey 一样

4.添加平台 android

5.编写代码

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">

     <title></title>

     <link href="lib/ionic/css/ionic.css" rel="stylesheet">

     <link href="css/style.css" rel="stylesheet">

     <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above

     <link href="css/ionic.app.css" rel="stylesheet">

     -->

     <!-- ionic/angularjs js -->

     <script src="lib/ionic/js/ionic.bundle.js"></script>

     <!-- cordova script (this will be a  during development) -->

     <script src="cordova.js"></script>

     <!-- your app's js -->

     <script src="js/app.js"></script>

     <script src="js/controllers.js"></script>

     <script src="js/services.js"></script>

   </head>

   <body ng-app="starter">

   <ion-nav-bar class="bar-positive">

     <ion-nav-back-button></ion-nav-back-button>

   </ion-nav-bar>

   <ion-nav-view name="mainContainer"></ion-nav-view>

   </body>

mian.html

 <ion-view view-title="极光推送Ionic Demo">

   <ion-content class="padding">

         <form name="jPushForm">

           <button class="button button-block button-positive" ng-click="init()">启动推送服务</button>

           <button class="button button-block button-energized" ng-click="stopPush()">停止推送服务</button>

           <button class="button button-block button-royal" ng-click="resumePush()">重启推送服务</button>

           <button class="button button-block button-light" ng-click="getPushState()">查看服务状态</button>

           <div class="list">

             <div class="item item-input-inset">

               <label class="item-input-wrapper">

                 <input type="text" placeholder="设置tag,多个tag用逗号分隔" required ng-trim="true" ng-model="options.tags" />

               </label>

               <input type="submit" class="button button-small button-positive" value="设置" ng-click="setTags()" />

               <!-- <button class="button button-small button-positive" ng-click="setTags()">

                 设置

               </button>-->

             </div>

             <div class="item item-input-inset">

               <label class="item-input-wrapper">

                 <input type="text" placeholder="设置alias" required ng-trim="true" ng-model="options.alias" />

               </label>

               <input type="submit" class="button button-small button-positive" value="设置" ng-click="setAlias()" />

               <!-- <button class="button button-small button-positive" ng-click="setAlias()">

                 设置

               </button> -->

             </div>

           </div>

           <button class="button button-block button-balanced" ng-click="setTagsWithAlias()">同时设置</button>

           <button class="button button-block button-royal" ng-click="cleanTagAndAlias()">清空设置</button>

           <a href="#/list">消息列表</a>

           <span class="error" ng-show="jPushForm.input.$error.required">要求输入设置值</span>

           <p>{{result}}</p>

         </form>

       </ion-content>

 </ion-view>

list.html

 <ion-view title="消息列表">

     <ion-content>

         <ion-list>

             <ion-item ng-repeat="item in items" href="#/detail?id={{item.id}}">

             对应消息:{{item.id}}

             </ion-item>

         </ion-list>

     </ion-content>

 </ion-view>

detail.html

<ion-view title="消息内容">

    <ion-content class="padding">

        {{message}}

    </ion-content>

</ion-view>

app.js

 var jpushdemo=angular.module('starter', ['ionic']);

 jpushdemo.run(function($ionicPlatform,$state,jpushService) {

   $ionicPlatform.ready(function() {

     // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard

     // for form inputs)

     if(window.cordova && window.cordova.plugins.Keyboard) {

       cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

     }

     if(window.StatusBar) {

       StatusBar.styleDefault();

     }

     //推送初始化

     var setTagsWithAliasCallback=function(event){

       window.alert('result code:'+event.resultCode+' tags:'+event.tags+' alias:'+event.alias);

     }

     var openNotificationInAndroidCallback=function(data){

       var json=data;

       window.alert(json);

       if(typeof data === 'string'){

         json=JSON.parse(data);

       }

       var id=json.extras['cn.jpush.android.EXTRA'].id;

       //window.alert(id);

       var alert = json.extras['cn.jpush.android.ALERT'];

       $state.go('detail',{id:id+alert});

     }

     var config={

       stac:setTagsWithAliasCallback,

       oniac:openNotificationInAndroidCallback

     };

     jpushService.init(config);

     //启动极光推送服务

     window.plugins.jPushPlugin.init();

     window.plugins.jPushPlugin.setDebugMode(true);

   });

   window.onerror = function(msg, url, line) {

    var idx = url.lastIndexOf("/");

    if(idx > -) {

     url = url.substring(idx+);

    }

    alert("ERROR in " + url + " (line #" + line + "): " + msg);

    return false;

   };

 })

 jpushdemo.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider,$urlRouterProvider) {

   $stateProvider.state('main',{

     url:'/main?url',

     views:{

       'mainContainer':{

         templateUrl: "templates/main.html",

         controller:'mainCtrl'

       }

     }

   }).state('list',{

     url:'/list',

     views:{

       'mainContainer':{

         templateUrl:'templates/list.html',

         controller:'listCtrl'

       }

     }

   }).state('detail',{

     url:'/detail?id',

     views:{

       'mainContainer':{

         templateUrl:'templates/detail.html',

         controller:'detailCtrl'

       }

     }

   });

   $urlRouterProvider.otherwise('/main')

 }])

controller.js

 jpushdemo.controller('mainCtrl', ['$scope','$ionicPopup','$stateParams','$state','jpushService',

   function ($scope,$ionicPopup,$stateParams,$state,jpushService) {

     $scope.message="";

     $scope.options={

         tags:"",

         alias:""

     };

     $scope.result="";

     // $scope.$on('$ionicView.beforeEnter',function(){

     //     var url=$stateParams.url;

     //     if(url){

     //         $state.go(url);

     //     }

     // });

     $scope.init=function(){

         jpushService.init();

         window.alert('执行启动');

     };

     $scope.stopPush=function(){

         jpushService.stopPush();

         window.alert('执行停止');

     };

     $scope.resumePush=function(){

         jpushService.resumePush();

         window.alert('执行重启');

     };

     $scope.getPushState=function(){

         jpushService.isPushStopped(function(data){

             if(data==){

                 window.alert('启动');

             }else{

                 window.alert('停止');

             }

         });

     };

     $scope.setTags=function(){

         var tagArr=$scope.options.tags.split(',');

         setTagsWithAlias(tagArr,null);

         //jpushService.setTags(tagArr);

     }

     $scope.setAlias=function(){

         var alias=$scope.options.alias;

         setTagsWithAlias(null,alias);

         //jpushService.setAlias(alias);

     }

     var setTagsWithAlias=function(tags,alias){

         jpushService.setTagsWithAlias(tags,alias);

     }

     $scope.setTagsWithAlias=function(){

         var tagArr=$scope.options.tags.split(',')

         if(tagArr.length==){

             tagArr=null;

         }

         var alias=$scope.options.alias;

         if(alias===''){

             alias=null;

         }

         setTagsWithAlias(tagArr,alias);

     }

     $scope.cleanTagAndAlias=function(){

         var tags=[];

         var alias="";

         setTagsWithAlias(tags,alias);

     }

 }])

 .controller('listCtrl', ['$scope','noticeService' ,function ($scope,noticeService) {

     $scope.items=noticeService.notices;

 }])

 .controller('detailCtrl', ['$scope','$stateParams', function ($scope,$stateParams) {

     var id=$stateParams.id;

     $scope.message='消息id：'+id;

 }])

services.js

 jpushdemo.factory('jpushService',['$http','$window','$document',function($http,$window,$document){

     var jpushServiceFactory={};

     //var jpushapi=$window.plugins.jPushPlugin;

     //启动极光推送

     var _init=function(config){

         $window.plugins.jPushPlugin.init();

         //设置tag和Alias触发事件处理

         document.addEventListener('jpush.setTagsWithAlias',config.stac,false);

         //打开推送消息事件处理

         $window.plugins.jPushPlugin.openNotificationInAndroidCallback=config.oniac;

         $window.plugins.jPushPlugin.setDebugMode(true);

     }

     //获取状态

     var _isPushStopped=function(fun){

         $window.plugins.jPushPlugin.isPushStopped(fun)

     }

     //停止极光推送

     var _stopPush=function(){

         $window.plugins.jPushPlugin.stopPush();

     }

     //重启极光推送

     var _resumePush=function(){

         $window.plugins.jPushPlugin.resumePush();

     }

     //设置标签和别名

     var _setTagsWithAlias=function(tags,alias){

         $window.plugins.jPushPlugin.setTagsWithAlias(tags,alias);

     }

     //设置标签

     var _setTags=function(tags){

         $window.plugins.jPushPlugin.setTags(tags);

     }

     //设置别名

     var _setAlias=function(alias){

         $window.plugins.jPushPlugin.setAlias(alias);

     }

     jpushServiceFactory.init=_init;

     jpushServiceFactory.isPushStopped=_isPushStopped;

     jpushServiceFactory.stopPush=_stopPush;

     jpushServiceFactory.resumePush=_resumePush;

     jpushServiceFactory.setTagsWithAlias=_setTagsWithAlias;

     jpushServiceFactory.setTags=_setTags;

     jpushServiceFactory.setAlias=_setAlias;

     return jpushServiceFactory;

 }])

 .factory('noticeService', [function () {

     var notices=[

         {id:,msg:'消息一'},

         {id:,msg:'消息二'},

         {id:,msg:'消息三'},

         {id:,msg:'消息四'},

         {id:,msg:'消息五'},

         {id:,msg:'消息六'},

         {id:,msg:'消息七'},

         {id:,msg:'消息八'}

     ];

     return {

         notices:notices

     };

 }])

6编译apk 运行文件

备注：编译过程中可能有错误，具体看情况处理，一般能生成apk 就运行了

7.生成apk 目录在项目文件 platforms\android\build\outputs 安装运行

8.查看终端手机通知信息以上代码都是从网上当得，修修改测试通过

Ionic JPush极光推送插件实例的更多相关文章

Ionic JPush极光推送二
1.看图解决问题 2.解决出现统计代码提示问题修改这个java 文件导入命名空间 import cn.jpush.android.api.JPushInterface; 添加方法 @Overr ...
在ionic/cordova中使用极光推送插件（jpush）
Stpe1:创建一个项目(此处使用的是tab类型的项目,创建方式可参照我前一篇如何离线创建Ionic1项目) Stpe2:修改项目信息打开[config.xml]修改下图内容:
atitit.web 推送实现方案集合(2)---百度云,jpush 极光推送 ,个推的选型比较.o99
atitit.web 推送实现方案集合(2)---百度云,jpush 极光推送 ,个推的选型比较.o99 1.1. 云推送有推送次数或频率的限制吗? 1 1.2. 推送的消息长度 1 1.3. 离线消 ...
极光推送使用实例（二） Android客户端
上一篇简单介绍了极光推送在Java服务端的实现,如果感兴趣的可以看一下极光推送使用实例(一)JAVA服务端.这篇文章介绍下极光推送在Android客户端的实现. JPush Android SDK 是 ...
使用JPush(极光推送)实现远程通知
使用JPush(极光推送)实现远程通知远程推送是APP 必备的功能, 现在第三方的 SDK 已经做的非常完备了, 在 iOS10.0出来之后, 极光推送也及时更新了他的 SDK, 今天小试了一下效果 ...
Laravel 集成 JPush 极光推送指北
我是一个 Laravel 小白,我是一个 Laravel 小白,我是一个 Laravel 小白(默念三遍再往下读,如果非小白就不用看了). Laravel 使用 Composer 来管理代码依赖.所以 ...
PhoneGap 的消息推送插件JPush极光推送
一. 什么是极光推送极光推送,使得开发者可以即时地向其应用程序的用户推送通知或者消息,与用户保持互动, 从而有效地提高留存率,提升用户体验.平台提供整合了 Android 推送.iOS 推送的统一推 ...
ionic中极光推送的集成
1.到极光官网注册账号,新建应用获得appkey. 详见:https://www.jiguang.cn/app/list 2.引入jpush插件详见:https://github.com/jpush ...
cordova极光推送插件使用
首先是在极光官网注册登录账号,然后创建推送应用,创建完应用之后,点击打开应用,设置应用的包名,保存: 然后回到应用主界面,看到AppKey,以及MasterSecret,这时候MasterSecret ...

随机推荐

Java开发系列-时间转换
获取当前时间戳 // 获取当前的时间戳 long time = new Date().getTime(); 将字符串时间戳转成格式的时间字符串 Long timestrap = Long.parseL ...
iOS开发系列-线程状态
概述线程从创建到销毁中间存在很多种状态. 线程的状态通过NSThread创建一条线程,开发者需要负责线程的创建和执行,线程的销毁由系统决定.创建一个继承NSThread的FMThread类,重写d ...
JS规则我与你同在(逻辑与操作符）数学中的“b大于a，b小于c”是“a<b<c”，那么在JavaScript中可以用&&表示
我与你同在(逻辑与操作符) 数学里面的"a>b",在JavaScript中还表示为a>b:数学中的"b大于a,b小于c"是"a<b& ...
php socket模拟http中post或get提交数据
php socket模拟http中post或者get提交数据的示例代码. 代码: sock_post.php: <?php /** * php socket模拟post\get请求 * 编辑:脚 ...
跳过爱奇艺优酷vip
1.google chrome浏览器 2.下载插件安装 Tampermonkey https://pan.baidu.com/s/1qvRQD2UO6gPHogjtSUBwUw 将 ...
Java 生成pdf表格文档
最近在工作做一个泰国的项目,应供应商要求,需要将每天的交易生成pdf格式的报表上传到供应商的服务器,特此记录实现方法.废话不多说,直接上代码: THSarabunNew.ttf该文件是泰国字体自行网上 ...
CF1097E Egor and an RPG game
最少反链划分数 = 最长链.实现:每次找出所有极大元作为一个反链. 任意长度小于k * (k + 1) / 2的排列都能被划分为不多于k个单调序列.且这是一个紧的上界. 然后这题就可以切了. 题意:给 ...
css - 常见知识点
1. 盒模型页面渲染时,dom 元素所采用的布局模型.可通过box-sizing进行设置.根据计算宽高的区域可分为: content-box (W3C 标准盒模型) border-box (IE ...
VS2010-MFC（对话框：创建对话框模板和修改对话框属性）
转自:http://www.jizhuomi.com/software/149.html 对话框,大家应该很熟悉了,在我们常用的软件中大多都有对话框界面,例如,360安全卫士的主界面其实就是个对话框, ...
操作系统命令工具Util
import java.io.BufferedReader; import java.io.IOException; import java.io.InputStream; import java.i ...

Ionic JPush极光推送 插件实例

Ionic JPush极光推送 插件实例的更多相关文章

随机推荐

热门专题

Ionic JPush极光推送插件实例

Ionic JPush极光推送插件实例的更多相关文章