Skip to content

How to use "deeplink" to land user to a particular app page?

Željko Brcković edited this page May 17, 2023 · 2 revisions

This page describes one of the approaches of handling deep links in your app. It uses references to Example app, to configure it for your credentials use How to start Example app

How to send deep link within the message

First you will need to identify the schema for your deep link, usually it is reverse DNS notation: com.infobip.mobilemessaging://deeplink/. And also define screens that you want to open as part of deep link, in Example app we will open settings screen And then it will be possible to send deep link with message and to handle notificationTapped event.

To send message with deeplink parameter you can use Portal or HTTP API, ask your account manager in case of further questions. For our example deep link parameter will be following com.infobip.mobilemessaging://deeplink/SETTINGS_SCREEN

Example of the code implementation

Create screens, which will be opened by the deeplink

In the Example app we have settings screen with name SETTINGS_SCREEN These screen added to screens list:

    init: function () {
        ...
        this.addScreen(SettingsScreen);
        ...
    },
    addScreen: function(screen) {
        ...
        this.screens[screen.NAME] = screen;
        ...
    },

Implement deeplinks handling method

In the Example app handleDeeplinkEvent method implemented in app.js:

    handleDeeplinkEvent: function (deeplink) {
        if (!deeplink) {
            utils.log('Deeplink is not provided');
            return;
        }
        var pathSegments = new URL(deeplink).pathname.split('/');
        for (var pathSegment of pathSegments) {
            if (pathSegment && this.screens[pathSegment]) {
                this.show(pathSegment);
            }
        }
    }

Handle deeplink on notificationTapped event.

Register for notificationTapped event and call handleDeeplinkEvent method.

    registerForEvents: function () {
        var _this = this;
        MobileMessaging.register("notificationTapped", function(message) {
            if (!message.deeplink) {
                return;
            }
            _this.handleDeeplinkEvent(message.deeplink);
        });
    }

Handle application opening by the deeplink

Register iOS application for custom URL scheme

In example iOS application is registered for com.infobip.mobilemessaging scheme, config to do it automatically provided in config.xml

    <platform name="ios">
        ...
        <config-file parent="CFBundleURLTypes" platform="ios" target="*-Info.plist">
            <array>
              <dict>
                <key>CFBundleTypeRole</key>
                <string>Editor</string>
                <key>CFBundleURLName</key>
                <string>com.infobip.mobilemessaging.cordova.example</string>
                <key>CFBundleURLSchemes</key>
                <array>
                  <string>com.infobip.mobilemessaging</string>
                </array>
              </dict>
            </array>
        </config-file>
    </platform>

Register Android application for custom URL scheme

In example Android application is registered for com.infobip.mobilemessaging scheme, config to do it automatically provided in config.xml

<platform name="android">
    <config-file target="AndroidManifest.xml" parent="/manifest/application/activity[@android:name='MainActivity']">
        <intent-filter>
            <data android:scheme="com.infobip.mobilemessaging" />
            <action android:name="android.intent.action.VIEW" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
        </intent-filter>
    </config-file>
</platform>

Handle deeplink on events

To handle deeplink if application opened by deeplink, register for deeplink event and call handleDeeplinkEvent:

    registerForEvents: function() {
        ...
        MobileMessaging.register("deeplink", function(deeplinkPath) {
            _this.handleDeeplinkEvent(deeplinkPath);
        });
    },

Full source code can be found in example application. It can be tested for Android by calling following from command line

adb shell am start -a android.intent.action.VIEW -d "com.infobip.mobilemessaging://deeplink/SETTINGS_SCREEN" com.example

for iOS just open link com.infobip.mobilemessaging://deeplink/SETTINGS_SCREEN in a browser.

Clone this wiki locally