Mobile Application Solutions Technology

How to Implement Firebase Dynamic Links in Flutter?

how-to-implement-firebase-dynamic-links-in-flutter
Contents hide
5 Process to Implement Firebase Dynamic Links in Flutter

Introduction

Using Flutter Firebase Dynamic Links, users get the best experience for the platform they open dynamic links on.

Firebase dynamic links are the URLs through which we can directly guide the user to any page within Android and iOS applications by a single click.

If a user opens a dynamic link in the browser, they can be redirected to parallel content on your website.

Flutter Firebase Dynamic links work across applications installed on your platform.

If a user opens Firebase Dynamic Links on the Android/iOS platform and doesn’t have your app installed, the user can be redirected to PlayStore or AppStore to install it and then, the app starts and the user can access the Firebase dynamic link.

Flutter Firebase Dynamic Links Work

Tech Stack We’re using: 

  • Flutter
  • Firebase

Tools We’re using: 

  • Visual Studio Code
  • Android Studio

Why is it Important?

  • Flutter Firebase Dynamic  links can help you to create a journey for users to grow the installation ratio.
  • These can help users to redirect to applications via a single click only.
  • Flutter Firebase Dynamic Links encourage users to create new experience when offers or deals are sent via links.
  • Firebase Dynamic Links are used by some famous apps.
Importance of flutter firebase dynamic links
  • Using Flutter Dynamic Links you can send users to specific sections of your application to show them important content.
  • Flutter lets you create  short URLs for dynamic links , it will be useful for Affiliate marketing, as it helps affiliates to promote their business marketing products and services.
  • Flutter Firebase Dynamic links increase conversion for user to user sharing.
  • It can also extend your application retention and conversion rate substantially.

1. Add Plugin to your flutter project.

Inside pubspec.yaml add the following plugin under dependencies and run flutter pub get in the terminal.

dependencies:
firebase_dynamic_links: latest

2. Configure and set up Firebase Project

2.1 .Create new firebase project (https://console.firebase.google.com/)

Enter the Project name and click the “Continue” button.

create firebase project

2.2 After successfully creating a Firebase Project, configure the android app.

Enter package name that can be found in you project/android/app/build.gradle

Add firebase to your android app

2.3 Setup  google-services.json.

After successfully adding google-services.json inside android/app, add Firebase Sdk to build.gradle.

download config file
select dynamic links from console panel

3.2 Add the URL prefix by entering the domain name. 

Here firebase will automatically provide some domains. You can edit the domain as you like and click the “Continue” button.

add prefix URL
create new dynamic links

4.2 Setup URL prefix. Here firebase will automatically provide some name after the URL.

You can edit that or keep it as it is and click the “Next” button.

setup your short URL link

Then the user will be redirected to the play store. Enter “Dynamic Link name”.

setup your dynamic link

If not, select another option.

define link behaviour for apple

4.5. Android app setup:

Select “Open the deep link in your Android App” and click the Next button.

define link behaviour for android

4.6 If you want to track a campaign with UTM parameters or Add social meta tags set up as per firebase documentation otherwise skip ”Campaign tracking, social tags and advanced options (optional)” and click “Create”.

looking to hire dedicated flutter developer for your next mobile app development
get dynamiclink

5. Setup AndroidManifest.xml(Optional)

If you want to open app directly without being redirected to the browser, add the following lines of code inside android/app/src/main/AndroidManifest.xml

<intent-filter>
    <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 YOUR_SCHEME://YOUR_HOST -->
    <data
     android:scheme="https"
     android:host="https://itoneclick.page.link" />
</intent-filter>

To create a dynamic link we have to add title, image and itemId.

Here I have added “id = itemId” after the link to identify specific items while handling dynamic links. 

Future createDynamicLink(
  BuildContext context,
  String title,
  String image,
  String itemId,
) async {
  bool short = true;
  final DynamicLinkParameters parameters = DynamicLinkParameters(
    //add urlPrefix as per point 3.2
    uriPrefix: 'https://itoneclick.page.link',
    //add link as per point 4.7
    link: Uri.parse('https://itoneclick.page.link/testing/?id=$itemId'),
    androidParameters: AndroidParameters(
      //android/app/build.gradle
      packageName: 'android package name',
      minimumVersion: 0,
    ),
    socialMetaTagParameters:
        SocialMetaTagParameters(title: title, imageUrl: Uri.parse(image)),
    dynamicLinkParametersOptions: DynamicLinkParametersOptions(
      shortDynamicLinkPathLength: ShortDynamicLinkPathLength.short,
    ),
    iosParameters: IosParameters(
      bundleId: 'ios bundleId',
      minimumVersion: '0',
    ),
  );

  Uri url;
  if (short) {
    final ShortDynamicLink shortLink = await parameters.buildShortLink();
    url = shortLink.shortUrl;
  } else {
    url = await parameters.buildUrl();
  }

  return url.toString();
}

To receive a firebase dynamic link call, getInitiaLink(). 

getInitiaLink() will return the URL that opened the app, otherwise, it will return null.

If the dynamic link is not null you can use the navigator inside the following method.

Future<void> initDynamicLinks() async {
  FirebaseDynamicLinks.instance.onLink(
      onSuccess: (PendingDynamicLinkData dynamicLink) async {
    final Uri deepLink = dynamicLink.link;

    if (deepLink != null) {
      //We have added id parameter while creating dynamic link
      //It will help you to find specific item from list and
      String id = deepLink.queryParameters['id'];
      print(id);
    }
  }, onError: (OnLinkErrorException e) async {
    print(e.message);
  });

//To Handle pending dynamic links add following lines
  final PendingDynamicLinkData data =
      await FirebaseDynamicLinks.instance.getInitialLink();
  final Uri deepLink = data?.link;

  if (deepLink != null) {
    String id = deepLink.queryParameters['id'];
    print(id);
  }
}

So, here we end up with successful creation and handle firebase dynamic links using Flutter and Firebase.

connect with our professional flutter developers to develop high-quality application

Conclusion

At last, Flutter firebase dynamic links are of great importance for Android/iOS users. It can help you to improve the user experience with your application. Firebase Dynamic Links can let you use these dynamic links in your applications to read all of their benefits more amazingly.

FAQs:

Dynamic Links create a connection to send users to an application directly without redirecting any browser.

Using Flutter, firebase dynamic links are very useful to create a straight path between users and beneficial, productive content of the app.

Firebase Dynamic Links are Free to use

Mobile APP Developers can deserve all the benefits and features of Firebase Dynamic Links without any cost.

Firebase Dynamic Links create productive, Straight and fascinating social and email campaigns in a more effective way.

Here is the list of advantages:

  • Easy to identify useful content
  • Enhance the user experience
  • Increase app install process
  • Drive conversions

Want to read more Blogs ?

Similar Post

Certified By

OneClick

Got more questions? Chat with our experts or schedule a call back

Bot 04:59
Hi how can i help you?