react-native-branch-deep-linking-attribution icon indicating copy to clipboard operation
react-native-branch-deep-linking-attribution copied to clipboard

Inconsistent behaviour when getting branch object from link

Open Vasault opened this issue 4 years ago • 4 comments

Hi everyone, I wasn't so sure about posting this, mostly because I´m not sure if this is an issue or a bad configuration, but after testing for several hours, I just realize this inconsistent behavior on the deep link can't be normal.

So this is what is happening, whenever I type on my branch link on the browser (using the web browser from inside the android emulator), I receive the branch object as normal, but after a few tries, it fails

Captura de Pantalla 2021-09-06 a la(s) 17 41 33

When it fails i get the object from above

Captura de Pantalla 2021-09-06 a la(s) 12 15 53

When it doesn't, i get this

The thing is, i get this randomly, sometimes work, sometimes doesn't, i don't see any pattern

This is part of my code

  const linking = {
    prefixes: ['agendameio://', 'https://agendameio.app.link'],
    async getInitialURL() {
      branch.skipCachedEvents();
      //const onReceiveURL = ({ url }: { url: string }) => listener(url);
      //Linking.addEventListener('url', onReceiveURL);
      //const url = await Linking.getInitialURL();
      const url = await branch.getFirstReferringParams();
      if (url != null) {
        return url;
      }
      //
      //const firstParams = await branch.getFirstReferringParams();
      //const latestParams = await branch.getLatestReferringParams();
      //console.log('first');
      //console.log(firstParams);
      //console.log('last');
      //console.log(latestParams)
      //console.log(onReceiveURL);
      console.log(url);
      return url; //firstParams['+url'] || latestParams['+url'];
    },
    subscribe(listener: any) {
      //branch.skipCachedEvents();
      const onReceiveURL = ({ url }: { url: string }) => listener(url);
      Linking.addEventListener('url', onReceiveURL);
      const unsubscribe = branch.subscribe(({ error, params, uri }) => {
        //console.log('error, params y uri');
        console.log(error);
        console.log(params);
        console.log(uri);
        if (error) {
          console.error('Error from Branch: ' + error);
          navigateWhenNavigationReady('Error', {});
          return;
        }
        if (params['+non_branch_link']) {
          //const nonBranchUrl = params['+non_branch_link'];
          //navigateWhenNavigationReady('Citas');
          return;
        }
        if (!params['+clicked_branch_link']) {
          return;
        }
        if (params?.['+match_guaranteed'] && params['~id'] === '951933826563912687') {
          console.log('paso por aca');
          navigateWhenNavigationReady('EmpresasScreen', { empresaId: 'params.id' });
        }
        const url = params.$canonical_url;
        listener(url);
        //branch.skipCachedEvents();
      });

      return () => {
        // Clean up the event listeners
        Linking.removeEventListener('url', onReceiveURL);
        unsubscribe;
      };
    },
    config: {
      screens: {
        Home: {
          screens: {
            Nav: {
              screens: {
                EmpresasScreen: {
                  path: 'empresa/:id',
                  parse: {
                    id: (id: number) => `${id}`,
                  },
                },
                DetalleEmpresaScreen: {
                  path: 'detalleEmpresa',
                },
                AgendamientoScreen: {
                  path: 'agendamiento',
                },
              },
            },
          },
        },
        Citas: {
          screens: {
            Citas: {
              screens: {
                CitasScreen: {
                  path: 'citas/:id',
                  parse: {
                    id: (id: number) => `${id}`,
                  }
                }
              }
            }
          }
        },
      },
    },
  };

Vasault avatar Sep 07 '21 13:09 Vasault

Hi @Vasault After further investigation, it seems the link you are testing, https://agendameio.app.link/empresa, is actually a bit misconfigured. The reason for the failed opens is because there are two link_click_id parameters appended to that open intent. link_click_ids are unique identifiers created on a Branch link click, to be applied as the only query parameter to the URI/URL opening the app (we do this for security and privacy reasons), so that the SDK can extract the link_click_id and deterministically provide accurate link data in its init response. After looking into the Link Data of https://agendameio.app.link/empresa there are indications where either a Branch Link was set as the redirect and our scraper service scraped a Branch Link (which is a no go, as we don't want to set Branch Links as the redirect to a Branch Link) Or you may have inputted a Branch Link in the "Original Web URL" text box on the Quick Link creation flow, which scrapes and applies data.

Regardless, I would create a new link to test and ensure not to use another Branch link as a redirect or paste it in the "Original Web URL" input box.

Additionally, I would strongly advise against using a static value of ~id for a conditional:

        if (params?.['+match_guaranteed'] && params['~id'] === '951933826563912687') {
          console.log('paso por aca');
          navigateWhenNavigationReady('EmpresasScreen', { empresaId: 'params.id' });
        } 

For the reason that the value for ~id is automatically generated as an 18 digit ID number for the link that drove the install/open, if present (0 for dynamic and 3P links), and therefore limits you to that very specific link. If the ID is utilized to route users to certain content in the link, I would suggest creating a more generic key-value pair (i.e screen: EmpressasScreen) So that it can be applied as Link Data to multiple links.

jf-branch avatar Oct 29 '21 14:10 jf-branch

@Vasault have you any luck with a solution?

henrymoulton avatar Nov 02 '21 12:11 henrymoulton

yeah, and I'm truly sorry for the late response, many projects on me I didn't get time to implement anything on this one, my solution was simple, while debugging my app, both js and native layers played me tricks, pretty much getting what the post says, also, I had to implement onOpenStart and OnOpenComplete to make it work every time, and now it works flawlessly

Although I'm having issues getting iOS to work, android works perfectly, on iOS my app simple opens and nothing more, but that's part of another topic, thanks for the help everyone

Vasault avatar Nov 10 '21 22:11 Vasault