zoukankan      html  css  js  c++  java
  • ionic 集成jpush

    参:http://www.cnblogs.com/linsu/p/5641158.html

    默认用户已在极光添加应用 已拿到appKey;

    1.进入项目根目录

    cd d:/jpushDemo

    2.添加jpush插件

    cordova plugin add https://github.com/jpush/jpush-phonegap-plugin.git --variable APP_KEY=your appkey

    3.修改plugins.xml

    查看 jpushDemo》plugins》jpush-phonegap-plugin》plugins.xml 大概在 line 13 

    查找

    <preference name="APP_KEY">

    修改为

        <preference name="APP_KEY"  value="your appkey" />

    4.添加android平台

    ionic platform add android

    5.编写代码

    index.html

     1 <!DOCTYPE html>
     2 <html>
     3   <head>
     4     <meta charset="utf-8">
     5     <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
     6     <title></title>
     7 
     8     <link href="lib/ionic/css/ionic.css" rel="stylesheet">
     9     <link href="css/style.css" rel="stylesheet">
    10 
    11     <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    12     <link href="css/ionic.app.css" rel="stylesheet">
    13     -->
    14 
    15     <!-- ionic/angularjs js -->
    16     <script src="lib/ionic/js/ionic.bundle.js"></script>
    17 
    18     <!-- cordova script (this will be a 404 during development) -->
    19     <script src="cordova.js"></script>
    20 
    21     <!-- your app's js -->
    22     <script src="js/app.js"></script>
    23     <script src="js/controllers.js"></script>
    24     <script src="js/services.js"></script>
    25 
    26 
    27   </head>
    28   <body ng-app="starter">
    29   <ion-nav-bar class="bar-positive">
    30     <ion-nav-back-button></ion-nav-back-button>
    31   </ion-nav-bar>
    32   <ion-nav-view name="mainContainer"></ion-nav-view>
    33   </body>

    main.html

     1 <ion-view view-title="极光推送Ionic Demo">
     2   <ion-content class="padding">
     3         <form name="jPushForm">
     4           <button class="button button-block button-positive" ng-click="init()">启动推送服务</button>
     5           <button class="button button-block button-energized" ng-click="stopPush()">停止推送服务</button>
     6           <button class="button button-block button-royal" ng-click="resumePush()">重启推送服务</button>
     7           <button class="button button-block button-light" ng-click="getPushState()">查看服务状态</button>
     8           <div class="list">
     9             <div class="item item-input-inset">
    10               <label class="item-input-wrapper">
    11                 <input type="text" placeholder="设置tag,多个tag用逗号分隔" required ng-trim="true" ng-model="options.tags" />
    12               </label>
    13 
    14               <input type="submit" class="button button-small button-positive" value="设置" ng-click="setTags()" />
    15               <!-- <button class="button button-small button-positive" ng-click="setTags()"> 
    16                 设置
    17               </button>-->
    18             </div>
    19             
    20 
    21             <div class="item item-input-inset">
    22               <label class="item-input-wrapper">
    23                 <input type="text" placeholder="设置alias" required ng-trim="true" ng-model="options.alias" />
    24               </label>
    25               <input type="submit" class="button button-small button-positive" value="设置" ng-click="setAlias()" />
    26               <!-- <button class="button button-small button-positive" ng-click="setAlias()">
    27                 设置
    28               </button> -->
    29             </div>
    30           </div>
    31           <button class="button button-block button-balanced" ng-click="setTagsWithAlias()">同时设置</button>
    32           <button class="button button-block button-royal" ng-click="cleanTagAndAlias()">清空设置</button>
    33           <a href="#/list">消息列表</a>
    34           <span class="error" ng-show="jPushForm.input.$error.required">要求输入设置值</span>
    35           
    36           <p>{{result}}</p>
    37         </form>
    38       </ion-content>
    39 </ion-view>

    list.html

    1 <ion-view title="消息列表">
    2     <ion-content>
    3         <ion-list>
    4             <ion-item ng-repeat="item in items" href="#/detail?id={{item.id}}">
    5             对应消息:{{item.id}}
    6             </ion-item>
    7         </ion-list>
    8     </ion-content>
    9 </ion-view>

    detail.html

    <ion-view title="消息内容">
        <ion-content class="padding">
            {{message}}
        </ion-content>
    </ion-view>

    app.js

     1 var jpushdemo=angular.module('starter', ['ionic']);
     2 
     3 jpushdemo.run(function($ionicPlatform,$state,jpushService) {
     4   $ionicPlatform.ready(function() {
     5     // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
     6     // for form inputs)
     7     if(window.cordova && window.cordova.plugins.Keyboard) {
     8       cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
     9     }
    10     if(window.StatusBar) {
    11       StatusBar.styleDefault();
    12     }
    13 
    14 
    15 
    16     //推送初始化
    17     var setTagsWithAliasCallback=function(event){
    18       window.alert('result code:'+event.resultCode+' tags:'+event.tags+' alias:'+event.alias);
    19     }
    20     var openNotificationInAndroidCallback=function(data){
    21       var json=data;
    22       window.alert(json);
    23       if(typeof data === 'string'){
    24         json=JSON.parse(data);
    25       }
    26       var id=json.extras['cn.jpush.android.EXTRA'].id;
    27       //window.alert(id);
    28       var alert = json.extras['cn.jpush.android.ALERT'];
    29       $state.go('detail',{id:id+alert});
    30     }
    31     var config={
    32       stac:setTagsWithAliasCallback,
    33       oniac:openNotificationInAndroidCallback
    34     };
    35 
    36     jpushService.init(config);
    37 
    38     //启动极光推送服务
    39     window.plugins.jPushPlugin.init();
    40     window.plugins.jPushPlugin.setDebugMode(true);
    41   });
    42 
    43   window.onerror = function(msg, url, line) {
    44    var idx = url.lastIndexOf("/");
    45    if(idx > -1) {
    46     url = url.substring(idx+1);
    47    }
    48    alert("ERROR in " + url + " (line #" + line + "): " + msg);
    49    return false;
    50   };
    51 })
    52 
    53 jpushdemo.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider,$urlRouterProvider) {
    54   $stateProvider.state('main',{
    55     url:'/main?url',
    56     views:{
    57       'mainContainer':{
    58         templateUrl: "templates/main.html",
    59         controller:'mainCtrl'
    60       }
    61     }
    62   }).state('list',{
    63     url:'/list',
    64     views:{
    65       'mainContainer':{
    66         templateUrl:'templates/list.html',
    67         controller:'listCtrl'
    68       }
    69     }
    70   }).state('detail',{
    71     url:'/detail?id',
    72     views:{
    73       'mainContainer':{
    74         templateUrl:'templates/detail.html',
    75         controller:'detailCtrl'
    76       }
    77     }
    78   });
    79   $urlRouterProvider.otherwise('/main')
    80 }])

    controller.js

     1 jpushdemo.controller('mainCtrl', ['$scope','$ionicPopup','$stateParams','$state','jpushService',
     2   function ($scope,$ionicPopup,$stateParams,$state,jpushService) {
     3     $scope.message="";
     4 
     5     $scope.options={
     6         tags:"",
     7         alias:""
     8     };
     9 
    10     $scope.result="";
    11 
    12     // $scope.$on('$ionicView.beforeEnter',function(){
    13     //     var url=$stateParams.url;
    14     //     if(url){
    15     //         $state.go(url);
    16     //     }
    17     // });
    18 
    19     $scope.init=function(){
    20         jpushService.init();
    21         window.alert('执行启动');
    22     };
    23 
    24     $scope.stopPush=function(){
    25         jpushService.stopPush();
    26         window.alert('执行停止');
    27     };
    28 
    29     $scope.resumePush=function(){
    30         jpushService.resumePush();
    31         window.alert('执行重启');
    32     };
    33 
    34     $scope.getPushState=function(){
    35         jpushService.isPushStopped(function(data){
    36             if(data==0){
    37                 window.alert('启动');
    38             }else{
    39                 window.alert('停止');
    40             }
    41         });
    42     };
    43 
    44     $scope.setTags=function(){
    45         var tagArr=$scope.options.tags.split(',');
    46         setTagsWithAlias(tagArr,null);
    47         //jpushService.setTags(tagArr);
    48     }
    49 
    50     $scope.setAlias=function(){
    51         var alias=$scope.options.alias;
    52         setTagsWithAlias(null,alias);
    53         //jpushService.setAlias(alias);
    54     }
    55 
    56     var setTagsWithAlias=function(tags,alias){
    57         jpushService.setTagsWithAlias(tags,alias);
    58     }
    59     $scope.setTagsWithAlias=function(){
    60         var tagArr=$scope.options.tags.split(',')
    61         if(tagArr.length==0){
    62             tagArr=null;
    63         }
    64 
    65         var alias=$scope.options.alias;
    66         if(alias===''){
    67             alias=null;
    68         }
    69         setTagsWithAlias(tagArr,alias);
    70 
    71     }
    72     $scope.cleanTagAndAlias=function(){
    73         var tags=[];
    74         var alias="";
    75         setTagsWithAlias(tags,alias);
    76     }
    77 }])
    78 
    79 .controller('listCtrl', ['$scope','noticeService' ,function ($scope,noticeService) {
    80     $scope.items=noticeService.notices;
    81 }])
    82 
    83 .controller('detailCtrl', ['$scope','$stateParams', function ($scope,$stateParams) {
    84     var id=$stateParams.id;
    85     $scope.message='消息id:'+id;
    86 }])

    services.js

     1 jpushdemo.factory('jpushService',['$http','$window','$document',function($http,$window,$document){
     2     var jpushServiceFactory={};
     3 
     4     //var jpushapi=$window.plugins.jPushPlugin;
     5 
     6     //启动极光推送
     7     var _init=function(config){
     8         $window.plugins.jPushPlugin.init();
     9         //设置tag和Alias触发事件处理
    10         document.addEventListener('jpush.setTagsWithAlias',config.stac,false);
    11         //打开推送消息事件处理
    12         $window.plugins.jPushPlugin.openNotificationInAndroidCallback=config.oniac;
    13         
    14 
    15         $window.plugins.jPushPlugin.setDebugMode(true);
    16     }
    17     //获取状态
    18     var _isPushStopped=function(fun){
    19         $window.plugins.jPushPlugin.isPushStopped(fun)
    20     }
    21     //停止极光推送
    22     var _stopPush=function(){
    23         $window.plugins.jPushPlugin.stopPush();
    24     }
    25 
    26     //重启极光推送
    27     var _resumePush=function(){
    28         $window.plugins.jPushPlugin.resumePush();
    29     }
    30 
    31     //设置标签和别名
    32     var _setTagsWithAlias=function(tags,alias){
    33         $window.plugins.jPushPlugin.setTagsWithAlias(tags,alias);
    34     }
    35 
    36     //设置标签
    37     var _setTags=function(tags){
    38         $window.plugins.jPushPlugin.setTags(tags);
    39     }
    40 
    41     //设置别名
    42     var _setAlias=function(alias){
    43         $window.plugins.jPushPlugin.setAlias(alias);
    44     }
    45 
    46 
    47 
    48     jpushServiceFactory.init=_init;
    49     jpushServiceFactory.isPushStopped=_isPushStopped;
    50     jpushServiceFactory.stopPush=_stopPush;
    51     jpushServiceFactory.resumePush=_resumePush;
    52 
    53     jpushServiceFactory.setTagsWithAlias=_setTagsWithAlias;
    54     jpushServiceFactory.setTags=_setTags;
    55     jpushServiceFactory.setAlias=_setAlias;
    56 
    57     return jpushServiceFactory;
    58 }])
    59 
    60 
    61 .factory('noticeService', [function () {
    62     var notices=[
    63         {id:1,msg:'消息一'},
    64         {id:2,msg:'消息二'},
    65         {id:3,msg:'消息三'},
    66         {id:4,msg:'消息四'},
    67         {id:5,msg:'消息五'},
    68         {id:6,msg:'消息六'},
    69         {id:7,msg:'消息七'},
    70         {id:8,msg:'消息八'}
    71     ];
    72 
    73     return {
    74         notices:notices
    75     };
    76 }])
  • 相关阅读:
    Java类加载器回顾
    2018第24周总结
    JUC类图
    CopyOnWrite 策略
    Python导入模块的几种姿势
    查看linux接口进出口流量的命令;linux 网络监控;流量监控
    jenkins修改日志级别方法
    top命令查看线程信息和jstack使用介绍
    How to force immediate stop of threads in Jmeter servers如何在jmeter执行完,立即停止jmeter
    pycharm支持react
  • 原文地址:https://www.cnblogs.com/xindejiyi/p/6929828.html
Copyright © 2011-2022 走看看