Can anyone help me that how i perform deeplinking with social sharing?

ionic-v1
1

i made link using this https://dashboard.branch.io/ . application is shared via social sharing plugin successfully and go to play store if application is not installed. but i wanted to share the particular item and the shared link will be open that particular shred item. How it is done with deeplinking?

Please help. any help is appreciated.
thanks.

1 Like
2

There are several ways to do this, but the easiest is to either choose one of the $***_url fields that are backed into the Branch link data, OR add a custom field that contains the deep link.

When you call Branch.init() inside your app, you will get back a $data packet that contains the original data you attached to the link. Then you just read the $***_url or custom field that contains your deep link, and navigate to it.

Here’s how I do it:

  init(): Promise<{ link: DeeplinkData } | null> {
    // only on devices. this is here for testing in browser.
    if (!this.platform.is('cordova')) {
      return;
    }

    this.Branch = window['Branch'];
    if (!this.Branch) {
      const msg = 'Branch.io cordova plugin not found';
      console.error(msg);
      return Promise.resolve(null);
    }

    return this.Branch.initSession(data => {
      if (data['+clicked_branch_link']) {
        // read deep link data on click
        const linkData = this.parseDeepLinkData(data);
        this.eventService.publish('deeplink:opened', { link: linkData });
      } else {
        console.log('Branch init callback ', data);
      }
    });
  }

And then the parser:

  parseDeepLinkData(deepLinkMatch) {
    // My code that generates the sharing links sets these 3 fields.
    // the identifier is whatever ID or something you use to identify the resource.
    // desktop_url is not really necessary, it overrides your dashboard settings.
    const url: string = deepLinkMatch.$desktop_url; 
    // The next two are critical for successful sharing + deeplinking.
    const path: string = deepLinkMatch.$deeplink_path;
    const identifier: string = deepLinkMatch.$canonical_identifier;

    const deepLinkData = {
      path,
      url,
      extra: { source: deepLinkMatch.source },
      params: { },
      pageName: '',
    };

    if (path.indexOf('somePage/') >= 0) {
      deepLinkData.pageName = 'SomeDetailsPage';
      deepLinkData.params['yourObjectId'] = identifier;
    }

    return deepLinkData;
  }

I then simply capture that data (via the eventService call that you see - you can choose whatever mechanism you like) in my app.component.ts and use it to navigate, sending the params directly into the page, which then knows how to resolve that ID back into data (it makes
a request to my API).

Easy when you see it working, but getting to that point was not at all obvious. I should probably write a blog post or something!

1 Like
3

thanks sir , item is shared but via some social links like google hangouts. but problem is there when i want to share or post on Facebook or Instagram or any other social link , it does not share /post the link. can branch deeplinking is done with Facebook or other social links except google hangouts?
could you please explain me how it is done?

4

does branch need a plugin?

I tried installing it using the following and it did not work

ionic cordova plugin add branch-cordova-sdk --save
5

Yes, Branch needs a plugin, that is the correct one. When you say “did not work”, what went wrong? How do you know it didn’t work?

6

the plugin failed to add. some error i do not remember now. I have moved pass batch using universal links for my deeplinking needs.

7

Universal links have limits and edge cases that Branch resolves… but if that works for you, then that’s great :slight_smile:

For anyone else: before you install the Branch sdk cordova plugin, make sure you have included the branch-config preferences block in your config.xml file, it is described in their documentation:

    <branch-config>
        <branch-key value="YOUR KEY" />
        <uri-scheme value="your app link" />
        <link-domain value="your app link from branch dashboard" />
        <ios-team-release value="iOS App ID" />
        <ios-team-debug value="iOS debug app ID" />
    </branch-config>
8

How did you create and share the link?