Skip to Content

Enable Push Notifications in Your Branded MDK Client

test
0 %
Enable Push Notifications in Your Branded MDK Client
Details

Enable Push Notifications in Your Branded MDK Client

September 10, 2020
Created by
March 10, 2020
Use the SAP Cloud Platform Mobile Services to enable push notifications in your branded MDK client.

You will learn

  • How to set up push notifications on an Apple Developer and Google Firebase account
  • How to configure push settings on SAP Cloud Platform Mobile Services
  • How to send push notification in your branded MDK client

Prerequisites

You may clone an existing metadata project from GitHub repository.


Step 1: Generate push configuration for Android/iOS device

Make sure you are choosing the right device platform tab above.

  1. Open the Firebase console, login with your Google account and click Create Project or Add Project (you will see this option if you already have any existing projects).

    MDK
  2. Provide a Project Name, click Continue.

    MDK
  3. Uncheck Enable Google Analytics for this project option and click Create Project.

    MDK
  4. Once the project is ready, click Continue.

    MDK
  5. Click Android icon to add Firebase to your Android app.

    MDK
  6. Provide a unique name to Android package name, click Register app.

    MDK
  7. Download goole-services.json file, click Next.

    MDK
  8. In Add Firebase SDK step, click Next.

  9. In the following step, click Next and then click Continue to console.

    MDK

In order to implement Push Notifications, a paid Apple developer account is required. Students or other developers with a personal Apple ID for their team will not be able to use push notifications, because they will not have access to the Developer Portal to generate the required certificate.

To enable your app for push notifications, you need to carry out the following tasks:

  • Obtain a certificate signing request
  • Register an iOS App ID
  • Create a new development certificate .CER file
  • Install the .CER file and create the .p12 file
  • Register your device
  1. Obtain a certificate signing request

    In order to use the Apple Push Notification service, you need to create a CSR file.

    On your Mac, open the Keychain Access application, and navigate to Keychain Access > Certificate Assistant > Request a Certificate From a Certificate Authority…

    MDK

    In the dialog, enter the email address which is associated with your Apple Developer account. Also, make sure you check the Request is saved to disk option.

    MDK

    Click Continue.

    Choose a folder to store the certificate – it is good practice to store generated files in a separate folder for each project – and click Save.

    Once you see a dialog saying the certificate is saved successfully, click Done to finish.

    MDK
  2. Register an iOS App ID

    Go to your Apple Developer Account and click Certificates, Identifiers & Profiles.

    MDK

    Click + icon to register a unique Identifiers for your application.

    MDK

    Select App IDs and click Continue.

    MDK

    Provide a unique Bundle ID name and Description.

    MDK

    Scroll down and select the Push Notifications capability from the list, click Continue.

    MDK

    In the following screen, select option for Deployment Details and then click Continue.

    Confirm your App ID by clicking on Register.

  3. Create a new development certificate .CER file

    Under Identifiers, search for the App ID that you registered in previous step.

    MDK

    Scroll down and select the Push Notifications capability, click Configure.

    MDK

    To configure push notifications for the App ID com.sap.mdk.demo, a Client SSL Certificate is required that will allow the notification server to connect to the Apple Push Notification Service. Each App ID requires its own Client SSL Certificate.

    Click Create Certificate to start the process for creating the needed .CER file.

    MDK

    Click Choose File and browse to the downloaded Signing Request CSR file, click Continue.

    Apple will now create a .CER file for you which is issued by the Apple Worldwide Developer Relations Certification Authority.

    MDK

    Click Download to download your certificate.

    MDK
  4. Install the .CER file and create the .p12 file

    In order to configure the APNS on SAP Cloud Platform Mobile Services, you need to install the .CER file and create the needed .p12 file.

    A .p12 file is a encrypted container for the certificate and private key. This file is needed by Mobile Services for the APNS configuration.

    Locate your downloaded .CER file and double-click it in order to install the certificate.

    In case the Add Certificate dialog pops up make sure to choose Login from the dropdown and click Add.

    If the certificate is added correctly to the Keychain you should see it in the MyCertificates section, make sure you selected login as keychain.

    MDK

    Select the certificate as well as the private key and right-click to export those two items.

    MDK

    Make sure that in the dropdown Personal Information Exchange (.p12) is selected and click Save. You will be prompted to enter a password, click OK to export the files.

    MDK
  5. Register your device

    Click + icon to register your iOS device.

    MDK

    Provide Device Name & Device ID (UDID) and then click Continue.

    MDK
Log on to answer question
Step 2: Provide information to Mobile Services

Make sure you are choosing the right device platform tab above.

  1. In Firebase console page, click gear icon and then click Project Settings.

    MDK
  2. Navigate to Cloud Messaging tab, copy the Server key.

    MDK
  3. In Mobile Services cockpit, navigate to Mobile Applications | Native/Hybrid | com.sap.mdk.demo | Mobile Push Notification. Paste the Server Key value in Android push settings in Mobile Services cockpit.

    MDK
  4. Repeat the above step for Sender ID and then click Save.

  1. In Mobile Services cockpit, navigate to the Mobile Push Notification feature for app id com.sap.mdk.demo.

    MDK
  2. Provide the following details to the Apple panel:

    Field Name Value
    APNS Endpoint Select Sandbox from the dropdown
    Authenticate Choose Certificate
    Certificate Browse to the.p12certificate you just exported
    Password Enter the password you provided during the export
  3. Click Save. You have now successfully configured the APNS Endpoint on the server side in Mobile Services cockpit.

    MDK
Which option is not available in the SAP Cloud Platform Mobile Services Push Configuration?
×
Step 3: Place push files in local MDK project

Make sure you are choosing the right device platform tab above.

Paste the downloaded google-services.json file to /demosampleapp.mdkproject/App_Resources/Android/ path.

MDK
  1. Create a new file named as app.entitlements and place it under /demosampleapp.mdkproject/App_Resources/iOS/ path.

    MDK
  2. Open this file and copy & paste the below information:

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
    <plist version="1.0">
    <dict>
    	<key>aps-environment</key>
    	<string>development</string>
    </dict>
    </plist>
    

    Assign a value of development or production to aps-environment key, depending only on which activity you are creating the provisioning profile for.

Log on to answer question
Step 4: Create MDK client

Follow step 4 from this tutorial to create your branded MDK client.

Log on to answer question
Step 5: Run the MDK client

Make sure you are choosing the right device platform tab above.

  1. Follow step 5 from this tutorial to create your branded MDK client.

  2. Once you accept the App update, a message should show Push Notification Registered. Click OK.

    MDK
  3. It is time now to send the first push notification from the SAP Cloud Platform Mobile Services push notification feature.

    Navigate to Mobile Services cockpit. In Mobile Push Notification feature, switch to Push Registrations tab.

    There you will find information about user registered for push notification and also details about Push providers. Identify your Device ID and click Send Notification.

    MDK
  4. In notification dialog, type a notification message and click Send.

    MDK

    You will see a success toast message.

    MDK

    After sending notification, mobile device should receive the message.

    MDK
  1. Follow step 5 from this tutorial to create your branded MDK client.

  2. Once you accept the App update, you will also notice that it will first ask permission to display notifications.

    MDK
  3. If push registration is successful, a message should show Push Notification Registered. Click OK.

    MDK
  4. It is time now to send the first push notification from the SAP Cloud Platform Mobile Services push notification feature.

    Navigate to Mobile Services cockpit. In Mobile Push Notification feature, switch to Push Registrations tab.

    There you will find information about user registered for push notification and also details about Push providers. Identify your Device ID and click Send Notification.

    MDK
  5. In notification dialog, type a notification message and click Send.

    MDK

    You will see a success toast message.

    MDK

    After sending notification, mobile device should receive the message.

    MDK

    If you have Apple watch connected to the iPhone device, you can also see same push notification on the Apple Watch.

    MDK

    MDK supports rich push notification. MDK does not run on smart watches or as an Apple watch application.

Congratulations! You have successfully completed Brand Your Customized App with Mobile Development Kit SDK mission and you are now all set to Create Extension Controls in Mobile Development Kit (MDK) Apps mission.

Log on to answer question

Next Steps

Back to top