Mobile App Performance, mPulse SDK - Cordova Integration Guide (iOS)
Instructions for adding the Mobile App Performance(MAP) / mPulse SDK to your Cordova app for iOS.
Required For Setup
- You must be an Akamai Ion customer to use this SDK. If you are not an Ion customer, please reach out to us at specialist@akamai.com
- MAP SDK License Key - Follow the steps given in this document to activate MAP SDK from the marketplace.
Example Project
For your convenience, we've created a Sample App/project that you can use to get started and learn about using MAP/mPulse SDK with Cordova.
Adding Akamai MAP/ mPulse SDK
1. Create an application
cordova create <directory> <appId (bundleId for iOS)> <appName>
cordova create /Volumes/Disk1/SampleCord com.akamai.cord sampleCord
2. Add iOS to Cordova
cordova platform add ios
3. Add akamai_sdk_init.xml to root directory of your project and modify/update the licenses and segments you are using:
com_akamai_map_license_key
com_akamai_mpulse_license_key
com_akamai_map_segments
<?xml version="1.0" encoding="utf-8"?>
<com_akamai_sdk_init>
<!-- Set the correct parameter values -->
<com_akamai_map_license_key>e04d913a1b5277c4b65d9ee068780da840280a5c5dbb0712100ff49e075496d5</com_akamai_map_license_key>
<com_akamai_mpulse_license_key>WXGVC-642RA-9Y42X-N32NE-ETSR</com_akamai_mpulse_license_key>
<com_akamai_map_segments>segment1</com_akamai_map_segments>
</com_akamai_sdk_init>
4. Modify iOS platform in config.xml (in the root directory of your project). Update the license keys and segment of your app
<platform name="ios">
<preference name="deployment-target" value="8.0" />
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
<!--APNs configuration-->
<config-file target="*-Info.plist" parent="UIBackgroundModes">
<array>
<string>fetch</string>
<string>remote-notification</string>
</array>
</config-file>
<!--MAP and mPulse configuration-->
<config-file target="*-Info.plist" parent="com.akamai">
<dict>
<key>mpulse</key>
<dict>
<key>api_key</key>
<string>WXGVC-642RA-9Y42X-N32NE-ETSR</string>
</dict>
<key>map</key>
<dict>
<key>api_key</key>
<string>e04d913a1b5277c4b65d9ee068780da840280a5c5dbb0712100ff49e075496d5</string>
<key>segments</key>
<array>
<string>segment1</string>
</array>
</dict>
</dict>
</config-file>
</platform>
5. Copy customPlugins from the SampleApplication to root directory of your project
6. Add akaIntegration plugin. Run this command at the root directory of your project
cordova plugin add customPlugins/akaIntegration
akaIntegration will now be added to the plugins folder.
7. Use the steps shared below to re-add the plugin if needed during changes to the app/cordova setup
cordova plugin rm akaIntegration
cordova plugin add customPlugins/akaIntegration
8. Prepare and build the app
cordova prepare ios
cordova build ios
9. MAP and mPulse Native iOS SDK will be added along with AkaCommon to your project
Adding Firebase
1. Add google-services.json and GoogleService-Info.plist to the root directory of your project.
2. Modify package.json to add Firebase in the root directory of your project
{
"name": "com.akamai.pushid",
"displayName": "sampleCord3",
"version": "1.0.0",
"description": "A sample Apache Cordova application that responds to the deviceready event.",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [
"ecosystem:cordova"
],
"author": "Apache Cordova Team",
"license": "Apache-2.0",
"dependencies": {
"cordova-ios": "^5.1.1",
"cordova-plugin-akaIntegration": "file:customPlugins/akaIntegration",
"cordova-plugin-androidx": "^1.0.2",
"cordova-plugin-androidx-adapter": "^1.1.0",
"cordova-plugin-firebasex": "^7.0.2"
},
"devDependencies": {
"cordova-plugin-whitelist": "^1.3.4"
},
"cordova": {
"plugins": {
"cordova-plugin-whitelist": {},
"cordova-plugin-firebasex": {
"FIREBASE_ANALYTICS_COLLECTION_ENABLED": "true",
"FIREBASE_PERFORMANCE_COLLECTION_ENABLED": "true",
"FIREBASE_CRASHLYTICS_COLLECTION_ENABLED": "true"
},
"cordova-plugin-akaIntegration": {}
},
"platforms": [
"ios"
]
}
}
3. Prepare and build the app
cordova prepare ios
cordova build ios
Integration with SDK's
Integration in this app is done using mainly two files:
-
customPlugins/akaIntegration/src/ios/akaIntegration.m
-
customPlugins/akaIntegration/www/akaIntegration.js
Basic initialization is done in akaIntegration.m file in
- (void)pluginInitilize
This will be called when the main WebView for application is created. To allow access to native functions you need to create a "wrapper" function. Add JS function to akaIntegration.js file and then implement it in akaIntegration.m.