Skip to content

Latest commit

 

History

History
177 lines (143 loc) · 5.45 KB

README.mkd

File metadata and controls

177 lines (143 loc) · 5.45 KB
Raw

A Cordova sample project using Kii Cloud Cordova plugin.

Usage

Get source code

Download zip and unzip.

Import Kii Cloud plugin

  • Add platform(iOS/Android)

    $ cordova platform add ios
$ cordova platform add android

  • Add kiicloud-plugin Go to the root folder of this sample code, import kiicloud-plugin plugin by the following script.

    $ cordova plugin add https://github.com/KiiPlatform/kii-cordova-plugin

Note: It requires Cordova CLI already setted up in your computer. For the details, please refer to Cordova Guide.

Initialize kiicloud-plugin

index.js file located under www/js folder

// replace APP_ID, APP_KEY, and KII_SITE with appropriate values
kii.Kii.initializeWithSite(APP_ID, APP_KEY, KII_SITE);

For more details, please refer to the guide.

Setup push for Android (GCM)

  • Replace sender_id with appropriate value (Project ID can be obtained in Google Developer Console).

index.js file located under www/js folder.

window.kiiPush.initAndroid("sender_id", "pushReceived", {
...

You need to configure GCM on Kii Cloud. About the details of setting GCM on Kii Cloud, please refer to guide.

Setup push for Android (FCM)

  • Replace sender_id with appropriate value.
    • Go to your FCM project and choose 'Manage' from Mobile App dropdown menu.
    • Choose 'Cloud Messaging' tab. copy 'Sender ID' value to your clipboard.
    • Edit index.js file located under www/js folder.
window.kiiPush.initAndroid("sender_id", "pushReceived", {
...

In FCM console, you can see 'Server key' in same screen. You need to save this Key in your Kii Cloud App Push Settings. guide. (Guides/ Console uses 'GCM' as label but putting FCM Key works fine.)

3rd argument of initAndroid is options dictionary.

{
  "app" : {
    // Options dictionary for "Push to app".
  },
  "user" : {
    // Options dictionary for "Push to user".
  },
  "direct" : {
    // Options dictionary for direct push.
  }
}

Options dictionary json schema:

{
  "title" : "Options dictionary",
  "type" : "object",
  "properties" : {
      "showInNotificationArea" : {
        "description" : "Indicate whether to show message in notification area.",
        "type" : "boolean",
        "default" : false
      },
      "useSound" : {
        "description" : "Indicate whether to ring sound when recieved push notification.",
        "type" : "boolean",
        "default" : false
      },
      "ledColor" : {
        "description" : "Specify color of LED to be shine when received push notification. ARGB value \"#AARRGGBB\" where AA, RR, GG, BB is hexa decimal. ex) \"#ff0000ff\" for BLUE",
        "type" : "string",
        "default" : ""
      },
      "vibrationMilliseconds" : {
        "description" : "Specify duration of vibration in milliseconds.",
        "type" : "integer",
        "default" : 0
      },
      "notificationTitle" : {
        "description" : "Specify notification title",
        "type" : "string",
        "default" : ""
      },
      "notificationBody" : {
        "description" : "Specify notification body",
        "type" : "string",
        "default": ""
      }
  }
}

Actual code will be like this.

var o = {
  showInNotificationArea: true,
  useSound: true,
  ledColor: "#ff0000ff", // BLUE in ARGB
  vibrationMilliseconds: 5000,
  notificatonTitle: "You have new message!",
  notificationBody: "Push notification arrived"
};

var options = {
  app: o,
  user: o,
  direct: o
};

window.kiiPush.initAndroid("sender_id", "pushReceived", options);

For notificationTitle and notificationBody you can use JSON Path to reference recived push message contents. In the example bellow, title and body field in recieved push message is used as notificatonTitle and notificationBody respectively.

var o = {
  showInNotificationArea: true,
  useSound: true,
  ledColor: "#ff0000ff", // BLUE in ARGB
  vibrationMilliseconds: 5000,
  notificatonTitle: "$.title",
  notificationBody: "$.body"
};

Setup push for iOS

  • Build for iOS platform to generate Xcode project.
$ cordova build ios

When done, CordovaSample.xcodeproj will be located under platforms/ios

  • Open CordovaSample.xcodeproj, and setup the production certificate, bundle identifier, code sign and distribution provisioning file.
  • Setup iOS push notification in Developer Portal on Kii Cloud. About the details, please refer to guide.

Send push notification

  • After successfully finished the steps above, launch the app and login/signup with a kii user.
  • Send push notification to device with Direct Push on Kii Cloud via developer console.

For the details, please refer to Kii Cloud iOS SDK Guide or Kii Cloud Android SDK Guide