Expo

Get Started
API Reference

Branch

expo-branch provides support for the Branch SDK, which is used for install referalls and attribution with deep links. This module only works in standalone apps you will need to build a standalone app in order to test it, rather than using Expo client.

Platform Compatibility

Android DeviceAndroid EmulatoriOS DeviceiOS SimulatorWeb

Installation

For managed apps, you'll need to run expo install expo-branch. In a bare React Native app, you should use react-native-branch-deep-linking-attribution instead.

  • Add the Branch Key to your app.json in the section android.config.branch.apiKey and ios.config.branch.apiKey. You can find your key on this page of the Branch Dashboard.
  • Add a linking scheme to your app.json in the scheme section if you don't already have one.
  • On iOS, the Branch module will automatically be bundled with your .ipa. For Android, expo-branch must be present in your dependencies in package.json at the time expo build:android is run in order for the module to be bundled with your .apk.

Branch can track universal links from domains you associate with your app. Note: Universal Links handled by Branch won't be forwarded to the Linking module.
  • Enable associated domains on Apple's Developer Portal for your app id. To do so go in the App IDs section and click on your app id. Select Edit, check the Associated Domains checkbox and click Done.
  • Enable Universal Links in the Link Settings section of the Branch Dashboard and fill in your Bundle Identifier and Apple App Prefix.
  • Add an associated domain to support universal links to your app.json in the ios.associatedDomains section. This should be in the form of applinks:<link-domain> where link-domain can be found in the Link Domain section of the Link Settings page on the Branch Dashboard.

import Branch, { BranchEvent } from 'expo-branch';

We pull in the API from react-native-branch-deep-linking-attribution, so the documentation there is the best resource to follow. Make sure you import Branch using the above instructions (from Branch).

Listen for links:
Branch.subscribe(bundle => {
  if (bundle && bundle.params && !bundle.error) {
    // `bundle.params` contains all the info about the link.
  }
});
Open a share dialog:
class ArticleScreen extends Component {
  componentDidMount() {
    this.createBranchUniversalObject();
  }

  async createBranchUniversalObject() {
    const { article } = this.props;

    this._branchUniversalObject = await Branch.createBranchUniversalObject(
      `article_${article.id}`,
      {
        title: article.title,
        contentImageUrl: article.thumbnail,
        contentDescription: article.description,
        // This metadata can be used to easily navigate back to this screen
        // when implementing deep linking with `Branch.subscribe`.
        metadata: {
          screen: 'articleScreen',
          params: JSON.stringify({ articleId: article.id }),
        },
      }
    );
  }

  onShareLinkPress = async () => {
    const shareOptions = {
      messageHeader: this.props.article.title,
      messageBody: `Checkout my new article!`,
    };
    await this._branchUniversalObject.showShareSheet(shareOptions);
  };
}