zoukankan      html  css  js  c++  java
  • ionic2集成极光推送

    ionic2集成极光推送;

    ionic2api:https://ionicframework.com/docs/

    极光推送官网:https://www.jiguang.cn

    android-怎么注册极光以及新建项目:https://docs.jiguang.cn/jpush/client/Android/android_3m/

    ios-怎么注册极光以及新建项目:https://docs.jiguang.cn/jpush/client/iOS/ios_guide_new/

    ioic项目搭建就不介绍了;

    在现有的项目上集成jpush;

    pack.json里添加:

    {
    ...
      "scripts": {
        "clean": "ionic-app-scripts clean",
        "build": "ionic-app-scripts build",
        "lint": "ionic-app-scripts lint",
        "ionic:build": "ionic-app-scripts build",
        "ionic:serve": "ionic-app-scripts serve"
      },
      "dependencies": {
        "@jiguang-ionic/jpush": "^1.0.2",
        "jpush-phonegap-plugin": "~3.3.4"
      },
      "cordova": {
        "plugins": {
          ..
          "jpush-phonegap-plugin": {
            "APP_KEY": "极光appkey"
          }
         ..
        },
        "platforms": [
          "android",
          "ios"
        ]
      }
    }

    参照官方文档:https://github.com/jpush/jpush-phonegap-plugin

    因为我们用了ionic所以我们需要@jiguang-ionic/jpush包;

    app.module.ts中增加:

    import { JPush } from '@jiguang-ionic/jpush';
    ...
      providers: [
        ...
        JPush,
        ...
      ]

    注册极光

    app.component.ts里增加:

    import { Component } from '@angular/core';
    import { Platform } from 'ionic-angular';
    import { StatusBar } from '@ionic-native/status-bar';
    import { SplashScreen } from '@ionic-native/splash-screen';
    import { JPush } from '@jiguang-ionic/jpush';
    
    import { HomePage } from '../pages/home/home';
    @Component({
      templateUrl: 'app.html'
    })
    export class MyApp {
      rootPage:any = HomePage;
    
      constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, jpush: JPush) {
        platform.ready().then(() => {
          // Okay, so the platform is ready and our plugins are available.
          // Here you can do any higher level native things you might need.
          statusBar.styleDefault();
          splashScreen.hide();
    
          jpush.init();//注册极光
          jpush.setDebugMode(true);
        });
      }
    }

    监听推送home.ts

    import { Component } from '@angular/core';
    import { NavController } from 'ionic-angular';
    import { JPush } from '@jiguang-ionic/jpush';
    import { Device } from '@ionic-native/device';
    
    @Component({
      selector: 'page-home',
      templateUrl: 'home.html'
    })
    export class HomePage {
    
      public registrationId: string;
    
      devicePlatform: string;
      sequence: number = 0;
    
      tagResultHandler = function(result) {
        var sequence: number = result.sequence;
        var tags: Array<string> = result.tags == null ? [] : result.tags;
        alert('Success!' + '
    Sequence: ' + sequence + '
    Tags: ' + tags.toString());
      };
    
      aliasResultHandler = function(result) {
        var sequence: number = result.sequence;
        var alias: string = result.alias;
        alert('Success!' + '
    Sequence: ' + sequence + '
    Alias: ' + alias);
      };
    
      errorHandler = function(err) {
        var sequence: number = err.sequence;
        var code = err.code;
        alert('Error!' + '
    Sequence: ' + sequence + '
    Code: ' + code);
      };
    
      constructor(public navCtrl: NavController, public jpush: JPush, device: Device) {
    
        this.devicePlatform = device.platform;
    
        document.addEventListener('jpush.openNotification', (event: any) => {
          alert('jpush.openNotification' + JSON.stringify(event));
          this.jpush.setBadge(0);
          this.jpush.setApplicationIconBadgeNumber(0);
        })
    
        document.addEventListener('jpush.receiveNotification', (event: any) => {
          var content;
          if (this.devicePlatform == 'Android') {
            content = event.alert;
          } else { 
            content = event.aps.alert;
          }
          alert('Receive notification: ' + JSON.stringify(event));
    
          this.jpush.setBadge(0);
          this.jpush.setApplicationIconBadgeNumber(0);
        }, false);
    
        document.addEventListener('jpush.openNotification', (event: any) => {
          var content;
          if (this.devicePlatform == 'Android') {
            content = event.alert;
          } else {  // iOS
            if (event.aps == undefined) { // 本地通知
              content = event.content;
            } else {  // APNS
              content = event.aps.alert;
            }
          } 
          alert('open notification: ' + JSON.stringify(event));
        }, false);
    
        document.addEventListener('jpush.receiveLocalNotification', (event: any) => {
          // iOS(*,9) Only , iOS(10,*) 将在 jpush.openNotification 和 jpush.receiveNotification 中触发。
          var content;
          if (this.devicePlatform == 'Android') {
          } else {
            content = event.content;
          } 
          alert('receive local notification: ' + JSON.stringify(event));
        }, false);
      }
    
      getRegistrationID() {
        this.jpush.getRegistrationID()
          .then(rId => {
            this.registrationId = rId;
          });
      }
    
      setTags() {
        this.jpush.setTags({ sequence: this.sequence++, tags: ['Tag1', 'Tag2']})
          .then(this.tagResultHandler)
          .catch(this.errorHandler);
      }
    
      addTags() {
        this.jpush.addTags({ sequence: this.sequence++, tags: ['Tag3', 'Tag4']})
          .then(this.tagResultHandler)
          .catch(this.errorHandler);
      }
    
      checkTagBindState() {
        this.jpush.checkTagBindState({ sequence: this.sequence++, tag: 'Tag1' })
          .then(result => {
            var sequence = result.sequence;
            var tag = result.tag;
            var isBind = result.isBind;
            alert('Sequence: ' + sequence + '
    Tag: ' + tag + '
    IsBind: ' + isBind);
          }).catch(this.errorHandler);
      }
    
      deleteTags() {
        this.jpush.deleteTags({ sequence: this.sequence++, tags: ['Tag4']})
          .then(this.tagResultHandler)
          .catch(this.errorHandler);
      }
    
      getAllTags() {
        this.jpush.getAllTags({ sequence: this.sequence++ })
          .then(this.tagResultHandler)
          .catch(this.errorHandler);
      }
    
      cleanTags() {
        this.jpush.cleanTags({ sequence: this.sequence++ })
          .then(this.tagResultHandler)
          .catch(this.errorHandler);
      }
    
      setAlias() {
        this.jpush.setAlias({ sequence: this.sequence++, alias: 'TestAlias' })
          .then(this.aliasResultHandler)
          .catch(this.errorHandler);
      }
    
      getAlias() {
        this.jpush.getAlias({ sequence: this.sequence++ })
          .then(this.aliasResultHandler)
          .catch(this.errorHandler);
      }
    
      deleteAlias() {
        this.jpush.deleteAlias({ sequence: this.sequence++ })
          .then(this.aliasResultHandler)
          .catch(this.errorHandler);
      }
    
      addLocalNotification() {
        if (this.devicePlatform == 'Android') {
          this.jpush.addLocalNotification(0, 'Hello JPush', 'JPush', 1, 5000);
        } else {
          this.jpush.addLocalNotificationForIOS(5, 'Hello JPush', 1, 'localNoti1');
        }
      }
    }

    具体api请查看官网文档,以上是在ts下的使用方式

  • 相关阅读:
    Mongodb C#客户端数据关联数据,使用Linq语法进行关联
    express增加swagger功能
    RabbitMQ错误检查
    nodejs mongoose populate 多层模型
    c# Mongodb
    vscode安装过的插件
    phantomjs安装步骤
    记录平时有用到的前端学习网站
    初学做uniapp项目过程梳理的一些记录
    用纯css实现双边框效果
  • 原文地址:https://www.cnblogs.com/wangzhichao/p/9183615.html
Copyright © 2011-2022 走看看