How to Set Up Affiliate Deep Links in React Native with React Navigation

Deep Linking for Affiliate Attribution in React Native

Deep linking is the foundation of mobile affiliate tracking — it connects the affiliate link tap to your app, carrying the attribution data that identifies which affiliate referred the user. In React Native with React Navigation, configuring deep links requires both native platform setup and JavaScript routing configuration.

Platform Configuration

iOS (Universal Links)

1. Add Associated Domains capability in Xcode (applinks:yourdomain.com)
2. Host apple-app-site-association file on your domain
3. Configure your AppDelegate to handle incoming URLs

Android (App Links)

1. Host assetlinks.json on your domain
2. Add intent filters with autoVerify="true" in AndroidManifest.xml
3. Configure your MainActivity to handle incoming intents

Both platforms require the native configuration files to verify that your app legitimately handles links from your domain.

React Navigation Deep Link Configuration

React Navigation supports deep linking through its linking configuration. Define URL patterns that map to your app's screens:

Configure the linking prop on your NavigationContainer with the prefixes (your affiliate domain) and a config object mapping URL paths to screen names.

However, for affiliate tracking, you do not necessarily need the deep link to navigate to a specific screen. The primary purpose is capturing the affiliate identifier from the URL parameters.

Capturing Attribution Data

The Insert Affiliate React Native SDK handles attribution capture when a deep link arrives:

1. The app receives the universal link / app link
2. Before React Navigation processes the URL for routing, the Insert Affiliate SDK extracts the affiliate identifier
3. The SDK stores the attribution locally and confirms it with the server
4. React Navigation then handles any navigation routing as normal

Initialise the Insert Affiliate SDK before setting up React Navigation to ensure attribution is captured before the URL is consumed by the router.

Handling the Linking Lifecycle

Deep links arrive in two scenarios:

App is running (warm start): The link arrives through React Native's Linking API. Listen for URL events and pass incoming URLs to both the affiliate SDK and your navigation handler.

App is not running (cold start): The initial URL that launched the app is available through Linking.getInitialURL(). Check this on app startup and process any affiliate parameters.

Deferred Deep Links (New Installs)

When a user taps an affiliate link but does not have the app installed:

1. They are redirected to the app store
2. They install and open the app
3. No deep link URL arrives (the install came from the store)
4. The Insert Affiliate SDK checks for pending server-side attributions on first launch
5. The attribution is resolved through device matching

Call the SDK's deferred attribution check during your app's initial load sequence.

Testing Deep Links

Test on real devices (not simulators for universal links):

• Use the iOS Notes app or Safari to click test affiliate links
• On Android, test from Chrome and messaging apps
• Test both cold start and warm start scenarios
• Verify attribution appears in Insert Affiliate's dashboard

Common Issues

• Universal links not firing: Ensure AASA file is accessible and valid. Test from Safari, not in-app browsers.
• Navigation conflicts: If multiple libraries handle URLs, ensure the affiliate SDK processes the URL first.
• Expo managed workflow limitations: Use development builds for full deep link testing.

Insert Affiliate's React Native SDK integrates with React Navigation's lifecycle, ensuring attribution is captured reliably regardless of how the user arrives at your app.