Intelligent deeplink from Smart App Banner

Smart App Banner is an easy way to introduce your iOS app to your web traffic. The setup is very simple, and to learn more about getting started with Smart App Banner for iOS, check out the How to promote your iOS app with Smart App Banner article. Even though the basic setup is very straight forward, it would be wise to take it one step further and customize the banner by providing a bit more navigational context. This lets your users deeplink from the smart app banner to your app seamlessly from your website by reducing the friction as much as possible. Let’s take a look at what that means, and how it can be done.

Smart App Banner is enabled by adding a meta tag on your web page. We saw a few attributes in the basic setup article, and they were

name = “apple-itunes-app”
content = “app-id=app-id-of-your app”

Now, let us learn about a new key that goes into the “content” attribute, which is “app-argument”. An app-argument should be a valid URL that represents the current state of the website. For example, if your domain is example.com and you’re currently on the contact us page, the app-argument should be the URL that represents that particular page. If the URL is https://example.com/contact-us, the meta tag will look something like this:

<meta name="apple-itunes-app" content="app-id=myAppStoreID, 
app-argument=https://example.com/contact-us">

What are the advantages of providing an app-argument?

App-argument provides a way to pass additional context information to your iOS application. We can then parse the extra metadata from the app-argument and take the user directly to the equivalent page in-app. This provides continuity in experience between the web and the app. This continuity covers various use cases such as 

1. passing the session info for a logged-in user, so that he/she can automatically be logged in inside the app
2. transfer the search keyword, so that results are already populated when the app is opened
3. provides full customization, as it is a URL, and can be parsed based on the unique requirement of the app.

How to receive this extra context inside your iOS app?

As mentioned earlier, the app-argument attribute should be a valid URL that corresponds to the current state on the web. This URL will be passed on to the application via the following AppDelegate method: 

func application(_ app: UIApplication, open url: URL, 
options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool

Once you receive the URL, you can deconstruct the URL to figure out the state and navigate to the corresponding page/viewController in the app. For example,

let url = URL(string: "https://example.com/profile/john")!
print(url.pathComponents)
> ["/", "profile", "john"]

By looking at url.pathComponents, we can see that the user was viewing John’s profile on the web when he decided to switch to the app. And hence, the app opens John’s profile thereby making the transition seamless.

Conclusion

Providing a seamless deeplink from Smart App Banner is a great way to promote your iOS app and an improvement in the overall user experience.