Deep Linking implementation in phonegap

Posted By : Avilash Choudhary | 28-Jun-2016



Deep Link is a link which redirects user to a particular content in the app. This link contains information when user clicks link it opens the app and app will have that information which is required to redirect user to a particular screen or functionality. Without deep link, you will have just a link which will just open the app, then you have to do all the work to get to that screen.

 cordova plugin add https://github.com/BranchMetrics/cordova-ionic-phonegap-branch-deep-linking.git --variable BRANCH_KEY= --variable URI_SCHEME=
 

NOTES: 

In iOS 9.2 Apple is not supporting the URI scheme redirects. So you have to enable the Universal Links

While creating app’s bundle identifier You have to enable the Associated domains from Apple Developer portal.

In Branch dashboard settings, provide bundle id and apple team id and enable Universal links.

Add this line on your config.xml

<branch-config>
        <ios-team-id value="apple_team_id"">
        <host name="bnc.lt" scheme="https"></host>
        </ios-team-id>
  </branch-config>
 

Apple team id will be available form Apple Developer portal. Now how to use and create deep link, First of all you have to initialise the branch

// call this function when app relaunch and resume.
function DeepLinkHandler(){

}
 

This data is in the form of JSON object, Every time app opens initialise the branch session and check for the clicked_brach_link attribute. if it is false then nothing to do. if it is true then user comes through deep link and you will get all the data that was inserted while creating the deep link.

var branchObj = null;
Branch.createBranchUniversalObject({
	canonicalIdentifier : 'identifier',
	title : 'title',
	contentDescription : 'description',
	contentImageUrl : '/image.jpg',
	contentIndexingMode : 'public'
}).then(function(newBranchObj) {
	// Success Callback
	branchObj = newBranchObj;
	console.log(newBranchObj);
}, function(err) {
	// Error Callback
	console.error(err);
});
 

write below code after some time out because creating branch universal object might take time. 

branchObj.generateShortUrl({
		// put your link properties here
		"feature" : "featureName",
		"channel" : "channelName",
		"data" : {
			"email" : "[email protected]"
		}
	}, {
		// put your control parameters here
		"$desktop_url" : "http://anyurl.com",
	}).then(function(res) {
		// Success Callback
		// your deep link url
		console.log(res.generatedUrl);
	}, function(err) {
		// Error Callback
		console.error(err);
	});
 

THANKS

About Author

Author Image
Avilash Choudhary

Avilash has excellent experience in developing mobile and web applications using jQuery , Javascript and PhoneGap. His hobbies are watching and playing cricket.

Request for Proposal

Name is required

Comment is required

Sending message..