Deeplinks, iOS, Android – Implement the Universal Links Deeplinks in Android or iOS applications

Did you ever heard about deep linking? And does the Universal Links deep linking issue ring a bell? If no, then maybe you’ll be interested by this post.

As I am working for few years from now on mobile applications, I have been often challenged on this topic of deep linking, but I must confess without really grasping the scope of this issue.

I found recently the occasion to deepen the question, this post is the result of these investigations both on iOS and Android.

What is deep linking?

From what I have understand so far to the deeplinks’ issue, is that the deeplink’s total achievement is to have a complete mirroring of a website’s URLs inside an mobile application.

I have discovered the subject mostly with the implementation of push notification as the marketing department wanted to target specific destinations inside a mobile application.

So when a mobile application is configured for deep linking, it allows users to launch your mobile application directly (if installed on their device) to specific content within the application.

Implementing deep linking may be crucial if you want to drive your mobile traffic incoming from search engine or social networks to your mobile application.

What is universal link?

The term is often used in the Apple’s documentation. So far, implementing deep link in a mobile application was made with custom URL scheme. Implementing deep linking with universal link scheme means that a set of web pages matches to locations in-app. As a consequence, when a user opens a web page which is matched as described, iOS automatically redirects the user to the app.

This behavior goes for Android too even though the term universal link is not used in the Android’s documentation.

Strong of these definitions, we will see how to implement both in iOS and Android deep linking with a universal link schema.

Each mobile platform and OS has its own implementation but they have similar patterns to a URL as explained earlier. The latest deep link integration for both iOS and Android looks like traditional URLs (for example, http://www.mysite.com/path/to/content or https://www.mysite.com/path/to/content ). However, previous versions of iOS and Android used a URI like this: mysite.com://path/to/content.

In the implementation, apply deferred deep linking as a URL and use a URI as a fallback. This enables you to handle third-party application flows that only support the URI scheme and users running a previous version of the OS.

Many resources that I have found were complicated or elusive and did not provide me a real pragmatic approach. What was interesting? It was to benchmark brands with a clear strategy between their website and their mobile applications as all the files are available on the web!

For instance, I have learned more by checking website such as BBC or Amazon than reading documentation or articles.

Example for BBC

http://www.bbc.com/.well-known/apple-app-site-association
http://www.bbc.com/.well-known/assetlinks.json

Example for AMAZON

https://www.amazon.com/.well-known/apple-app-site-association
http://www.amazon.com/.well-known/assetlinks.json

Design a quick user story

It is easy to get confused with this damn deep link thing, the best idea is to write a quick user story to have a clear idea of what to implement.

For instance, let’s say you have a responsive website selling clothes for men, women and kids. In parallel, you made developed 2 mobile applications for iOS and Android. Your ambition is to drive most of you mobile traffic to the first application dedicated to men’s clothing and the rest of the traffic to the second application.

Main destination on your website
http://www.mysite.com/mens

Other destinations on your website
http://www.mysite.com/women
http://www.mysite.com/kids
http://www.mysite.com/about
….

Requirements for iOS

First, you have to created a directory named /.well-known/ at the root of your server so you can have an URL like http://www.mysite.com/.well-known/

Second, you add a file named apple-app-site-association with no extension on your server in this new created directory. In broad terms, this file will associated your website domain with your applications. In our case, we have 2 applications declared for our domain name, this file is served at http://www.mysite.com/.well-known/apple-app-site-association

Here is the content of the file apple-app-site-association for your scenario. The appID of your application can be found easily in your account at identifiers :: App IDs in developper.apple.com

{
    "applinks": {
        "apps": [],
        "details": [
            {
                "appID": "QAD8G6WYIH.com.mybrand.app.first",
                "paths":[
                        "/mens/*"
                        ]
            },
            {
                "appID": "QAD8G6WYIH.com.mybrand.app.second",
                "paths": [ "*"]
 
            }
        ]
    }
}

Requirements for Android

You have to create almost the same requirements for Android.
First of all, there is 2 required information: The SHA-256 of your application and the package_name. For instance, “package_name” looks like something like this “com.mybrand.appfirst”. If you have Firebase, installed on your applications, one of the easiest way to find the SHA-256 of your application is to go in firebase :: project settings :: look for SHA-256.

  • You need the “package_name”: “com.mybrand.appfirst”
  • You need to paste the SHA-256 of your application “sha256_cert_fingerprints”:
    [“72:54:A6:87:D7:B8:99:63:9D:37:B4:AE:35:11:35:1E:3F:B8:65:FB:6F:23:C5:D8:51:80:29:1B:EB:F4:1C:5F”]

Then, you have to created a file named assetlinks.json and place it in the same directory as of iOS /.well-known/. So, the file will be accessible http://www.mysite.com/.well-known/assetlinks.json.

For your information, you can associate a website with multiple mobile application.

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
    "namespace": "android_app",
    "package_name": "com.mybrand.appfirst",
    "sha256_cert_fingerprints":
    ["AE:80:9F:2C:D5:E4:A9:0C:12:07:DD:E7:99:1A:2E:1C:87:DC:3D:F7:11:A9:3A:55:C8:5B:A3:63:65:33:BC:5D"]
  }
},{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
    "namespace": "android_app",
    "package_name": "com.mybrand.appsecond",
    "sha256_cert_fingerprints":
    ["4B:51:95:12:F0:1B:1D:11:88:4C:37:DC:A2:69:6B:03:D8:69:EC:E7:6A:3B:5C:4A:BE:41:4C:A7:9C:38:10:3D"]
  }
}]

Use the Android Intent Filters
With the help of the Intent Filters, your Android Application, the ability for both application to handle deep links on https, http and keep the custom schema mysite.com://

 
<activity
    android:name="com.example.android.MensActivity"
    android:label="@string/title_mens" >
 
    <intent-filter android:label="@string/filter_view_https_mens">
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <!-- Accepts URIs that begin with "https://www.mysite.com/mens -->
        <data android:scheme="https"
              android:host="www.mysite.com"
              android:pathPrefix="/mens" />
        <!-- note that the leading "/" is required for pathPrefix-->
    </intent-filter>
 
    <intent-filter android:label="@string/filter_view_http_mens">
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <!-- Accepts URIs that begin with "http://www.mysite.com/mens -->
        <data android:scheme="http"
              android:host="www.mysite.com"
              android:pathPrefix="/mens" />
        <!-- note that the leading "/" is required for pathPrefix-->
    </intent-filter>
    <intent-filter android:label="@string/filter_view_example_mens">
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <!-- Accepts URIs that begin with "mysite.com://mens -->
        <data android:scheme="mysite.com"
              android:host="mens" />
    </intent-filter>
</activity>

Source: https://proandroiddev.com/best-practices-for-deeplinking-in-android-1dc1ea060c0c

The deep linking’s Quiz

Here is few answers to different questions that I have tried to answer for my own comprehension. The only stupid question is the one that is never asked, no?

How can I test my deep linking implementation on several mobile application
It is very tedious to test deeplink in several applications. I found an article from Sergii Zhuk, a big shot in Android, who has given a pretty nice solution: create a QR code for each deep link so you can be used it also both for Android and iOS application.

Source: https://proandroiddev.com/best-practices-for-deeplinking-in-android-1dc1ea060c0c

How do assetlinks.json file must be served?

The assetlinks.json file must be served as Content-Type: application/json in the HTTP headers, and it cannot be a redirect (that is, 301 or 302 response codes are not followed).

Is there something to add to robots.txt

Apparently, there is no instruction to add to the robots.txt, to allow or disallow the bots to browse this destination, you have to leave the access to the files.

#useless to add any instruction instruction 
Allow: /.well-known/
Allow: /apple-app-site-association

Conclusion: It is the minimum to know in order to make a simple and robust implementation of Universal link for Deep links. Last but not least, if you find too hard to make such implementation, you can resort to some tools such as Branch or Firebase.

To read more