Link React Native SDK

To get started with Plaid Link for React Native youʼll want to sign up for free API keys through the Plaid Developer Dashboard.

• React Native Version 0.66.0 or higher
• See the Android setup guide and iOS setup guide for platform-specific requirements

In your react-native project directory, run:

1npm install --save react-native-plaid-link-sdk

Next Steps

• To set up the SDK for use in your Android application, see the Android Set Up guide.
• To set up the SDK for use in your iOS application see the iOS Set Up guide.
• For a sample app that demonstrates a minimal integration with the React Native Plaid Link SDK, see the Tiny Quickstart (React Native).

Before you can open Link, you need to first create a link_token. A link_token can be configured for different Link flows and is used to control much of Link's behavior. To see how to create a new link_token, see the API Reference entry for /link/token/create. If your React Native application will be used on Android, the link/token/create call should include the android_package_name parameter. Each time you open Link, you will need to get a new link_token from your server.

1<PlaidLink
2  tokenConfig={{
3    token: '#GENERATED_LINK_TOKEN#',
4  }}
5  onSuccess={(success: LinkSuccess) => {
6    console.log(success);
7  }}
8  onExit={(exit: LinkExit) => {
9    console.log(exit);
10  }}
11>
12  <Text>Add Account</Text>
13</PlaidLink>

1const onSuccess = (success: LinkSuccess) => {
2  fetch('https://yourserver.com/exchange_public_token', {
3    method: 'POST',
4    headers: {
5      "Content-Type": "application/json",
6    },
7    body: JSON.Stringify({
8      publicToken: linkSuccess.publicToken,
9      accounts: linkSuccess.metadata.accounts,
10      institution: linkSuccess.metadata.institution,
11      linkSessionId: linkSuccess.metadata.linkSessionId,
12    }),
13  });
14};

1const onExit = (linkExit: LinkExit) => {
2  supportHandler.report({
3    error: linkExit.error,
4    institution: linkExit.metadata.institution,
5    linkSessionId: linkExit.metadata.linkSessionId,
6    requestId: linkExitlinkExit.metadata.requestId,
7    status: linkExit.metadata.status,
8  });
9};

The React Native Plaid module emits onEvent events throughout the account linking process. To receive these events use the usePlaidEmitter hook.

1usePlaidEmitter((event) => {
2  console.log(event);
3});

Using Plaid Link with an OAuth flow requires some additional setup instructions. For details, see the OAuth guide.

• When upgrading from 9.x to 10.x, you should remove any invocation of useDeepLinkRedirector on iOS, as it has been removed from the SDK, since it is no longer required for handling Universal Links. You must make sure you are using a compatible version of React Native (0.66.0 or higher) and the Plaid iOS SDK (see the version compatibility chart on GitHub).
• To upgrade from version 6.x to 7.x or 8.x, see the 6.x to 7.x migration guide.
• To upgrade from version 5.x to 7.x or 8.x, see the 5.x to 7.x migration guide.
• The only difference between version 7.x and 8.x is that 8.x adds support for Xcode 14. No code changes are required to upgrade from 7.x to 8.x, although you must convert to an Xcode 14 toolchain.
• No code changes are required to upgrade from 8.x to 9.x, although you must make sure you are using a compatible version of the Plaid iOS SDK (4.1.0 or higher).