Search code examples
cordovaionic-frameworkinvitebranch.io

Cordova integration of branch.io for invite to app


I want to use branch.io to create invite links within a cordova app. So I installed the plugin.

in app.js:

 branch.init(branchIoKey, function(err, data) {
     console.log(err);
     console.log(data);
  });
  $ionicPlatform.on("resume", function(event) {
      console.log('app resume event', event);
      branch.init(branchIoKey, function(err, data) {
          console.log(err)
          console.log(data);
      });
  });

So far so good. I also get some result here.

EDIT start:

Of course I set the identity after successful registration / login. So a user is always unique.

EDIT end.

But from then I have absolutely no idea:

1) How do I get the invite link for the current user which he can share via Mail, Twitter, Facebook, SMS etc. ?

2) How do I detect in the other device whether the app was installed through such a branch.io invite link?

3) How do I create such a beautiful Welcome Page with foto and name of the referrer if I detect such a link?

The documentation of branch.io is more less a rough install guide plus API documentation. Not sufficient enough as sample code for this case is not included anywhere. At least I found no hint.

On their page they have 4 steps: SHARE, CLICK, DOWNLOAD, PERSONALIZE. Last point is not covered.

I just want to reward the referrer with some in app credtis for each successful invite.


Solution

  • I can help out here! I recently went back and updated almost all of the documentation on our developer portal for all the platforms we support. Up until then, it was pretty bare bones. You can see the full extent of the documentation there:

    To answer your questions:

    1. In order to create links, you need to use the link() method.

    Below is an example but the full reference is here:

    branch.link({
        channel: 'facebook',
        feature: 'share',
        data: {
            mydata: 'something',
            foo: 'bar',
            '$desktop_url': 'http://myappwebsite.com',
            '$og_title': 'Check out my app',
            '$og_description': 'My app is disrupting apps.',
            '$og_image_url': 'http://myappwebsite.com/image.png'
        }
    }, function(err, link) {
        console.log(err, link);
    });
    
    1. In order to detect whether the device was installed via a Branch link, you just need to look for some of the custom control parameters that we conveniently bundle into the callback, primarily +clicked_branch_link.

    Here's an example snippet that shows how it's done:

    branch.init("YOUR BRANCH KEY HERE", function(err, data) {
        if (!err) {
            var prettyData = JSON.parse(data.data);
            if (prettyData["+clicked_branch_link"]) {
                // do some stuff
            }
        }
    });
    
    1. We're in the process of building an awesome full stack invite SDK, but in the mean time, you'll have to build it yourself.

    Basically, I'd suggest loading the the personal welcome view if you detect that a user originates from a Branch invite link. If you stuff all the referring user's data into the link when you create it in the get go, you can prefill some personal welcome and even show the user's face if so.