Firebase dynamic links are null after new install, but work well when installed

Viewed 657

The deep linking configuration works well for both iOS and Android when the app is installed. The configuration files seem okay for the domain https://friends.unblnd.com/dynamic.

But deep links are not recognised after an install.

So the listener works well, but getting the initial url when starting from the background isn't.

  • Logcat: Pixel 2, emulator

// When app is installed we get the expected behaviour:

I/ReactNativeJS: 'FIREBASE LISTENING:', { utmParameters: 
       { utm_source: 'firebase',
         utm_medium: 'dynamic_link',
         utm_campaign: 'Online Cooking | UNBLND' },
      minimumAppVersion: null,
      url: 'https://unblnd.com/invite/group/eyJpdiI6IkNyMSsxTnJRWHJyQys3ZWZZd0R5Tnc9PSIsInZhbHVlIjoiRlFaQ2o3R0F0cnRpLzFvYzZ3WC9tQT09IiwibWFjIjoiOWFhZmIzZjk2MjM1MGQ5YTU5Y2M5YjBmOTIwNTdjODZkMzE3ZGY4ZTMyOTZmOTNhY2ZhZGM5NGNjNzc1NDEzYiJ9' }

// When the Firebase Dynamic Link (friends.unblnd.com/dynamic/aF8A) is clicked, and the app needs to be installed, after the install the deep link is not found:

I/ReactNativeJS: 'FIREBASE URL:', null
  • React Native: configuration

Deeplinking is configured within React Navigation v5. A custom function for getting the initial url is added and the subscribe function, the following const linking is added as an attribute <NavigationContainer linking={linking} ...>

  const linking = {
    prefixes: [
      'https://friends.unblnd.com/dynamic/',
      ...
    ],
    config: deepLinksConf,
    // Custom function to get the URL which was used to open the app
    async getInitialURL() {
      // First, you may want to do the default deep link handling
      // Check if app was opened from a deep link
      const url = await Linking.getInitialURL();
      console.log('FOUND URL:', url);

      if (url != null) {
        return url;
      }

      // Next, you would need to get the initial URL from your third-party integration
      // It depends on the third-party SDK you use
      const link = await dynamicLinks().getInitialLink();
      for (var i = 0; i < 20; i++) {
        setTimeout(async function () {
          console.log('FIREBASE:', i, await dynamicLinks().getInitialLink());
        }, 500 * i);
      }
      console.log('FIREBASE URL:', url);

      return link.url;
    },
    // Custom function to subscribe to incoming links
    subscribe(listener) {
      // First, you may want to do the default deep link handling
      const onReceiveURL = ({url}) => {
        console.log(url);
        ... handle url
        listener(url);
      };

      // Listen to incoming links from deep linking
      Linking.addEventListener('url', onReceiveURL);

      const unsubscribeToDynamicLinks = dynamicLinks().onLink((link) => {
        console.log('FIREBASE LISTENING:', link);
        onReceiveURL(link);
      });

      return () => {
        // Clean up the event listeners
        unsubscribeToDynamicLinks();
        Linking.removeEventListener('url', onReceiveURL);
      };
    },
  };

- Configuration: Firebase Dynamic Links

Open the deep link in your Android App [APP]

If your app is not installed, send the user to Google Play page for your app

- React Native: Info

System:
    OS: macOS 11.5.2
    CPU: (8) x64 Intel(R) Core(TM) i7-1068NG7 CPU @ 2.30GHz
    Memory: 43.73 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.17.0 - /usr/local/bin/node
    Yarn: Not Found
    npm: 6.14.15 - ~/htdocs/unblnd_app/node_modules/.bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.10.2 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: iOS 14.5, DriverKit 20.4, macOS 11.3, tvOS 14.5, watchOS 7.4
    Android SDK:
      API Levels: 28, 29
      Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.2
      System Images: android-29 | Intel x86 Atom_64, android-29 | Google APIs Intel x86 Atom, android-29 | Google Play Intel x86 Atom
      Android NDK: Not Found
  IDEs:
    Android Studio: 4.2 AI-202.7660.26.42.7486908
    Xcode: 12.5.1/12E507 - /usr/bin/xcodebuild
  Languages:
    Java: 1.8.0_265 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.1 => 17.0.1 
    react-native: 0.64.2 => 0.64.2 
    react-native-macos: Not Found
    @react-native-firebase/analytics: "^12.8.0",
    @react-native-firebase/app: "^12.8.0",
    @react-native-firebase/dynamic-links: "^12.8.0",
    @react-navigation/native: "^5.9.4",
    @react-navigation/stack: "^5.14.5",

How to make it work as expected? Now, it has the same behaviour as internal url schemes... Maybe it is required to try Branch.io?

2 Answers

After looking up firebase documentation and other stackoverflow options, we created a piece of code that helped to resolve this issue.

You need to add "FirebaseDynamicLinksCustomDomains" parameter in info.plist file.

Dynamical URL : https://yourapp.page.link/?link=https://yourapp.com/test=12345&isi=14602xxxxx&ibi=com.xxxx.yourapp

The important parameter in info.plist file :

<key>FirebaseDynamicLinksCustomDomains</key>
<array>
    <string>https://yourapp.com</string>
    <string>https://yourapp.com/link</string>
</array> 

If you have a production critical app which has this issue, do not hesitate to ask me for inputs. Hit me up at https://khushalbhalsod.nl.

Related