Universal Links in React Native: Complete iOS Setup Guide

import { NavigationContainer, useNavigation } from '@react-navigation/native';
import { Linking } from 'react-native';
import { useEffect } from 'react';

const linking = {
  prefixes: ['https://myapp.com', 'https://www.myapp.com'],
  config: {
    screens: {
      Home: '',
      Product: 'product/:id',
      UserProfile: 'user/:userId',
      NotFound: '*',
    },
  },
  async getInitialURL() {
    // Handle notification-opened while app was killed
    const url = await Linking.getInitialURL();
    if (url != null) {
      return url;
    }
  },
};

export function RootNavigator() {
  const navigationRef = useRef(null);

  useEffect(() => {
    const listening = Linking.addEventListener('url', ({ url }) => {
      navigationRef.current?.resetRoot({
        index: 0,
        routes: [
          {
            name: 'Home',
            state: {
              routes: [
                {
                  name: 'Product',
                  params: { id: extractProductId(url) },
                },
              ],
            },
          },
        ],
      });
    });

    return () => listening.remove();
  }, []);

  return (
    <NavigationContainer ref={navigationRef} linking={linking}>
      {/* Your screens */}
    </NavigationContainer>
  );
}

function extractProductId(url: string): string {
  return url.split('/product/')[1];
}

import UIKit
import React

@main
class AppDelegate: UIResponder, UIApplicationDelegate {

  var window: UIWindow?

  func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
    let rootViewController = RCTRootViewController()
    rootViewController.bundle = Bundle(url: jsCodeLocation)

    self.window = UIWindow(frame: UIScreen.main.bounds)
    self.window?.rootViewController = rootViewController
    self.window?.makeKeyAndVisible()

    return true
  }

  // Handle universal links
  func application(
    _ application: UIApplication,
    continue userActivity: NSUserActivity,
    restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void
  ) -> Bool {
    if userActivity.activityType == NSUserActivityTypeBrowsingWeb,
       let url = userActivity.webpageURL {

      // React Navigation will handle the routing
      RCTLinkingManager.application(application, open: url, sourceApplication: nil, annotation: [:])
      return true
    }

    return false
  }
}