React Native
Configure Branch
- Configure your Default Link Settings
Install Branch
Expo
Expo provides a File-based routing solution for iOS, Android, and web which automatically enables deep linking and query parameters for every page of your app. This makes Branch setup easier than ever!
The native Branch API is not available in the Expo Go app due to app store restrictions on tracking. To use Branch with Expo, you can create a custom development build with react-native-branch
. The community Branch Config Plugin can be used to automatically configure react-native-branch
with Expo Prebuild.
via Pure React Native App
Note
react-native-branch requires react-native >= 0.60
- Install the module
npm install [email protected]
yarn add [email protected]
via Native iOS app with CocoaPods
platform :ios, '11.0'
target 'APP_NAME' do
# if swift
use_frameworks!
pod 'react-native-branch', path: '../node_modules/react-native-branch'
end
- Run
pod install
to regenerate thePods
project with the new dependencies. Note that the location ofnode_modules
relative to yourPodfile
may vary.
Configure App
iOS
- Configure Bundle Identifier
- Configure Associated Domains
- Configure Entitlements
- Configure Info.plist
Android
Initialize Branch
iOS
- In your app's
AppDelegate file
:
import RNBranch
@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
// Initialize the Branch Session at the top of existing application:didFinishLaunchingWithOptions:
func application(_ application: UIApplication, didFinishLaunchingWithOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
// Uncomment this line to use the test key instead of the live one.
// RNBranch.useTestInstance()
RNBranch.initSession(launchOptions: launchOptions)
return true
}
// Add the openURL and continueUserActivity functions
func application(_ app: UIApplication, open url: URL, options: [UIApplicationOpenURLOptionsKey : Any] = [:]) -> Bool {
return RNBranch.application(app, open:url, options:options)
}
func application(_ application: UIApplication, continue userActivity: NSUserActivity, restorationHandler: @escaping ([Any]?) -> Void) -> Bool {
return RNBranch.continue(userActivity)
}
#import "AppDelegate.h"
#import <RNBranch/RNBranch.h>
@implementation AppDelegate
// Initialize the Branch Session at the top of existing application:didFinishLaunchingWithOptions:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
// Uncomment this line to use the test key instead of the live one.
// [RNBranch useTestInstance];
[RNBranch initSessionWithLaunchOptions:launchOptions isReferrable:YES];
NSURL *jsCodeLocation;
//...
}
- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
[RNBranch application:app openURL:url options:options];
return YES;
}
- (BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler {
[RNBranch continueUserActivity:userActivity];
return YES;
}
@end
Android
- Add Branch to your
MainApplication.java
// import from RNBranch
import io.branch.rnbranch.RNBranchModule;
public class MainApplication extends Application implements ReactApplication {
// add onCreate() override
@Override
public void onCreate() {
super.onCreate();
// Branch logging for debugging
RNBranchModule.enableLogging();
RNBranchModule.getAutoInstance(this);
}
- Add Branch to your
MainActivity.java
import io.branch.rnbranch.*;
import android.content.Intent;
public class MainActivity extends ReactActivity {
@Override
protected String getMainComponentName() {
return "base";
}
// Override onStart:
@Override
protected void onStart() {
super.onStart();
RNBranchModule.initSession(getIntent().getData(), this);
}
// Override onNewIntent:
@Override
public void onNewIntent(Intent intent) {
super.onNewIntent(intent);
RNBranchModule.onNewIntent(intent);
}
}
Implement Features
Import Branch
- In any React Native source file that uses the Branch SDK.
import branch from 'react-native-branch'