Page tree
Skip to end of metadata
Go to start of metadata

The Push Notification Services are available with the Smartface written apps. This guide explains how to use the Push Notification Services with the Smartface for both Android and iOS apps

For Android

Before Coding

Please, go to cloud.google.com and sign in with your Google ID. After logging in, click “Go to my console” link at the top of the page.

 If you’ve never been used the Google Cloud Services before, you’ll see a red ‘CREATE PROJECT’ button in the middle of screen. Click this button.

Fill your Project Name and Project ID. Pay attention to write correct Project ID here, this will be your Bundle ID of your app also.

You can find your Project Number here, which will be used later:

Click on ‘APIs’ under “APIs & auth” section and turn on the Google Cloud Messaging for Android

It should be turned on after that:

Then go to ‘Credentials’ and click “CREATE NEW KEY” button.

 If your backend service will be at Server Side, you should select ‘Server key’

Write down your server IP addresses

And your API KEY and Sender ID are ready for the Smartface

Using in Smartface 

Requirements

Open your project.json file which is located under config folder. Write down your sender ID which is generated via Google Cloud Center.

Notification Icon

In order to set icon for notification, resource folders are used. For Android 5.0 and over, Android uses notification icon as mask(that is, only alpha channel is used). And the icon for notification must be placed under native v21 folders. In default, there won’t be any folder ends with v21, developer needs to add them manually under the projects resource folder as in the below screenshot:

Push notification icon MUST be named as notificationicon_sb.png.
Before, icon.png was used, but now if developer does not set new icon with name notificationicon_sb.png, notification icon will appear as the default icon of Smartface.

Coding Time

First, let’s register Push Notification services in our app with these lines of code with onStart Event method (This function makes GCM registration process):

Notifications.remote.registerForPushNotifications

You can check this method works or not by writing an alert box indicates “Success” or “Fail”:

function Application_OnStart(e) {
	Notifications.remote.registerForPushNotifications({
		OnSuccess : function () {
			alert("Success");
		},
		OnFailure : function () {
			alert("Fail");
		}
	});
}

You can print device token to screen with this method by an alert box (Also you can send this token to the another service):

alert(Notifications.remote.token);

Also, you can print data on the screen, which is coming from Push Notification, with “dataKey” method below with Global OnReceivedNotification event or just use it for different purposes (More than one key value is available):

Application.onReceivedNotification = function (e) {
	alert(Notifications.remote.data["dataKey"]["aps"]);
}

For iOS

Configurations on MAC

Open Keychain Access on your Mac and use ‘Certificate Assistant’ to “Request a Certificate from a Certificate Authority….”

 

Write your information and choose ‘Saved to disk’

After that, you will find your created key under Category section, right-click it and “Export” this key to somewhere at your Mac, for example under Desktop folder. Pay attention to export it with .p12 extension.

Now you’re ready to upload this key to the Apple Developer site.


Apple Developer Site

You need to get an Apple ID for your development with Push Notification permission.

Go to developer.apple.com and click on Member Center.

 Enter your username and password. Click on ‘Certificates, Identifiers & Profiles”

 

Click on ‘Identifiers’ under iOS Apps section

Register your iOS App ID by clicking on + button on the right side and fill that page.
Attention: Bundle ID is very important also for Push Notifications. Please fill this line with the same name as your application. Since Apple will check this Bundle ID before sending you Device Token.

At the end of this page, select ‘Push Notification’ and continue.

It will summarize your App ID and you can confirm it, if ‘Push Notification’ is enabled.

Check out your App ID whether it is available with Push Notification option under ‘App ID’ section with your other apps.

After that, you need to add ‘New Provisioning Profile’ for your app. That’s why, select your app and ‘Edit’ your App ID.

At the end of the page, you’ll see Push Notification section of your app. You need to click on ‘Create Certificate’ for development.

Select your App ID for Push Notification use and continue.

Again continue and you’ll see ‘Generate your certificate’ screen. Here is place to upload your certificate to Apple Developer site, which is mentioned top of article (.p12 file). Click on Generate to continue.

,

When you finish generating, this page will be appear on screen and you can download generated SSL Certificate from Apple Developer site to use it at Xcode for development.

 

You’ll get aps_development.cer file after downloading. You can use it with double-clicking on that file. You’ll see that it is now associated with the private key which is generated by you at the Keychain Access.

 

 Now turn back to Apple Developer site and select ‘Provisioning Profile’ under iOS Apps section. Add a new profile like below:

Select iOS App Development:


Select your App ID:


Select the certificate to make available it with this provisioning profile.

Select your devices:

Give the name of this provisioning profile name:

Coding Time

Push Notification services are only work with published projects.

First, let’s register Push Notification service in our app with these lines of code at Project Script (app asks user for permission to send push notifications):

Notifications.remote.registerForPushNotifications

You can check this method works or not by writing an alert box indicates “Success” or “Fail”:

function Application_OnStart(e) {
	Notifications.remote.registerForPushNotifications({
		OnSuccess : function () {
			alert("Success");
		},
		OnFailure : function () {
			alert("Fail");
		}
	});
}

You can print device token to screen with this method by an alert box (Also you can send this token to the another service):

alert(Notifications.remote.token);

Also, you can print data on the screen, which is coming from Push Notification, with “dataKey” method below with Global OnReceivedNotification event or just use it for different purposes (More than one key value is available):

Application.onReceivedNotification = function (e) {
	alert(Notifications.remote.data["dataKey"]["aps"]);
}