Handling Firebase Dynamic Links in Flutter.

Nikita Gandhi
Flutter Community
Published in
6 min readJan 22, 2019

Now that you have your app dynamic links ready, you’re ready to go viral. In case you missed on how to create dynamic links, you can refer my last article here.

I’m going to make this explanation lucid for you. Consider you have started a new business with friend with whom you tried cooking delicious sandwiches and you want to attract more attention towards it. Apart from the small marketing team set for your business, your friends, family can also help by working from their places remotely. Now that you want to know who is your friend “indeed”, here’s how you can check on them using Firebase Dynamic Linking.

Before you share the dynamic links, create a unique identifier for each user and attach it to their individual links.

1. Prepare

a. Let them know!

Create a button called refer and earn, which allows you to share dynamic links for your app. Links are nothing but drivers who will take your customers correctly to your Store Page. Make sure the link has a unique identifier attached. This will allow you to track individual links in future.

b. Get friendly with the tracker!

Well in this mission, Firebase is going to help you to track your relationships with your network. In short, all your dynamic links created manually or programatically can be tracked through Firebase.

c. Join hands with the agent :

  1. Create an account on Firebase and register your app.
  2. Go to Dynamic Links section of the Firebase console.
  3. Notice the domain displayed at the top section of the page. This will exactly look like the “domain” that you used to create dynamics link. That is “example.page.link”.
Firebase Console Screen.

The above picture shows a graph analysis of clicks for the link, number of times the link was redirected to the Store successfully, how many apps were installed after the link was redirected and many more!

d. Time to launch the mission?

Well, before you set your agents out on work, prepare them with right equipments.

To set your trackers for iOS users, follow the steps below :

  1. In the Info tab of your project, create a new URL Type which will be used by the dynamic links.
  2. Set the identifier field to a unique value, and the URL Schemes field = bundle identifier, which is the default URL scheme used by Dynamic Links.
  3. In the Capabilities tab of your app’s Xcode project, enable Associated Domains and add the following to the Associated Domains list: applinks:YOUR_SUBDOMAIN.page.link.

Hi-fi! your iOS tracker is getting ready for the mission. Android tracker is already a strong tracker and needs no extra equipments.

2. Launch :

a. Get, Set, Go!

Your trackers are now ready for work, so cheers, let’s launch the mission! When you find someone new at your store, it can be either of the three cases :

  1. Direct visit(download) from the store without any reference.
  2. First time download through a referral.
  3. Already a customer, which means the user had already installed the app before receiving the dynamic links.

b. Know the source :

In case you observe a new customer, (a new app download in this case), check from where did they come to know about you.

To check if the recently installed app was through a referral or directly from the AppStore/PlayStore, implement the below portion of code in your main method.

Calling retrieveDynamicLink() method :

Future<void> retrieveDynamicLink() async {
final PendingDynamicLinkData data =
await FirebaseDynamicLinks.instance.retrieveDynamicLink();
final Uri deepLink = data?.link;

if (deepLink != null) {
Navigator.pushNamed(
context, deepLink.path);
return deepLink.toString();
}
}

This method will receive a deep link in case the app was installed through a referral. It will return null in case the app was installed directly without any reference source. Make sure you include this code in the main method of the app.

The asynchronous call will store the instance from the Firebase server.

We will then store the data captured from the Firebase instance in a Uri.

The data URI scheme is a uniform resource identifier (URI) scheme that provides a way to include data in-line in web pages as if they were external resources.

Now in case there was no deep link received while installing the app, (case1 & case3), then function retrieveDynamicLink() will return null.

However, if the app was successfully installed using the provided dynamic link and the login to the app was successfully done, i.e the user is first time user, the referee deserves a credit! Take a note of this referee!

Yay! In case your retrieveDynamicLink() function returns a Uri, this is your first hint that maybe the user is a first time user.

c. We’ve got 99 problems but this won’t be one!

Now in case the user directly opens the home widget, the initState() method state was already evoked. Hence, it will not retrieve any deep link. In cases like these, you need to call a senior supervisor : “widget binding observer”.

class _HomePageState extends State<_HomePage> with WidgetsBindingObserver{
.
.
.
@override
void
initState() {
super.initState();
WidgetsBinding.instance.addObserver(this);
}

@override
void
didChangeAppLifecycleState(AppLifecycleState state) {
if (state == AppLifecycleState.resumed) {
_retrieveDynamicLink();
}
}

Future<void> _retrieveDynamicLink() async {
final PendingDynamicLinkData data = await FirebaseDynamicLinks.instance.retrieveDynamicLink();
final Uri deepLink = data?.link;
if (deepLink != null) {
Navigator.pushNamed(context, deepLink.path);
}
}
}

The above method will receive dynamic link (if any) every time the home widget is called.

d. Is the job done right??

Wait, attention please! In iOS, the appLifeCycle is resumed before the link is received. In this case, we will not be able to receive the link. Well relax! The solution is just one line ahead of this line!

@override
void
didChangeAppLifecycleState(AppLifecycleState state) {
if (state == AppLifecycleState.resumed) {
_timerLink = new Timer(const Duration(milliseconds: 1000), () {
_retrieveDynamicLink();
});
}
}

We just hacked the problem with a solution of small delay of 1000 milliseconds.

If you received a link from the above method, split the link and store the unique identifier only.

e. Delete the History!

Well now that you have got your job done from the detective, it’s time that you leave no traces for your friend to know that you have tracked them. So, dispose it off, smarty!

@override
void
dispose() {
WidgetsBinding.instance.removeObserver(this);
if (_timerLink != null) {
_timerLink.cancel();
}
super.dispose();
}

Conclusion :

Referred and Earned!

Well, if you correctly implement the steps mentioned above, then you can already start planning for small treats for the real friends who helped you growing your business! Well done, you earned a major implementation of code for growing your business!

Make a list of party guests!

With the identifiers collected above, you can map those with the users. They are nothing but the friends who helped you in marketing!

Reward them with nice return gifts! Credit the user and appreciate their efforts!

Well, that’s not done right until you refer this article of mine to as many friends as you can if you found this article useful. Feel free to connect me on Twitter here : https://twitter.com/nikkitagandhi or you can also write me here.

In case you are beginner in Flutter, my articles for Basics of Scaffold and creating multi page applications may also be useful to you.

Adios, see you soon with the next one! :)

--

--

Nikita Gandhi
Flutter Community

Community Manager at Google Developers, Flutter Enthusiast