如何获取深度链接至iOS应用的外部应用信息及创建RN原生模块
在React Native中创建iOS原生模块获取深度链接的外部应用信息
步骤1:创建原生模块文件
在iOS项目的Classes目录下新建两个文件:DeepLinkInfoModule.h和DeepLinkInfoModule.m。
DeepLinkInfoModule.h
#import <React/RCTBridgeModule.h> #import <React/RCTEventEmitter.h> @interface DeepLinkInfoModule : RCTEventEmitter <RCTBridgeModule> @end
DeepLinkInfoModule.m
#import "DeepLinkInfoModule.h" #import <UIKit/UIKit.h> @implementation DeepLinkInfoModule RCT_EXPORT_MODULE(); // 声明支持的事件类型 - (NSArray<NSString *> *)supportedEvents { return @[@"DeepLinkReceived"]; } // 导出供RN调用的方法,获取启动时的深度链接来源信息 RCT_EXPORT_METHOD(getDeepLinkSourceInfo:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) { NSMutableDictionary *sourceInfo = [NSMutableDictionary dictionary]; UIApplication *app = [UIApplication sharedApplication]; // 获取启动时的深度链接URL NSURL *launchURL = app.launchOptions[UIApplicationLaunchOptionsURLKey]; if (launchURL) { sourceInfo[@"launchURL"] = launchURL.absoluteString; // 获取来源应用的Bundle ID NSString *sourceAppBundleID = app.launchOptions[UIApplicationLaunchOptionsSourceApplicationKey]; if (sourceAppBundleID) { sourceInfo[@"sourceAppBundleID"] = sourceAppBundleID; } } if (sourceInfo.count > 0) { resolve(sourceInfo); } else { reject(@"NO_DEEP_LINK", @"无可用的深度链接来源信息", nil); } } @end
步骤2:修改AppDelegate传递后台唤醒的深度链接
在AppDelegate.m中处理应用唤醒时的深度链接,并将信息传递给原生模块:
#import "DeepLinkInfoModule.h" @implementation AppDelegate // 处理自定义URL Scheme唤醒 - (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options { NSString *sourceAppBundleID = options[UIApplicationOpenURLOptionsSourceApplicationKey]; RCTBridge *bridge = self.bridge; DeepLinkInfoModule *module = [bridge moduleForClass:[DeepLinkInfoModule class]]; // 向RN发送深度链接事件 [module sendEventWithName:@"DeepLinkReceived" body:@{ @"url": url.absoluteString, @"sourceAppBundleID": sourceAppBundleID ?: @"unknown" }]; return YES; } // 处理Universal Links唤醒 - (BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler { if ([userActivity.activityType isEqualToString:NSUserActivityTypeBrowsingWeb]) { NSURL *url = userActivity.webpageURL; // 获取浏览器跳转的Referer链接 NSURL *referrerURL = userActivity.referrerURL; RCTBridge *bridge = self.bridge; DeepLinkInfoModule *module = [bridge moduleForClass:[DeepLinkInfoModule class]]; [module sendEventWithName:@"DeepLinkReceived" body:@{ @"url": url.absoluteString, @"referrerURL": referrerURL ? referrerURL.absoluteString : @"unknown" }]; } return YES; } @end
步骤3:在React Native中调用原生模块
监听实时深度链接事件
import { NativeModules, NativeEventEmitter, useEffect } from 'react-native'; const { DeepLinkInfoModule } = NativeModules; const deepLinkEmitter = new NativeEventEmitter(DeepLinkInfoModule); useEffect(() => { const subscription = deepLinkEmitter.addListener('DeepLinkReceived', (info) => { console.log('深度链接来源信息:', info); // 这里可处理sourceAppBundleID或referrerURL }); return () => subscription.remove(); }, []);
主动获取启动时的深度链接信息
import { NativeModules, useEffect } from 'react-native'; const { DeepLinkInfoModule } = NativeModules; const fetchLaunchDeepLinkInfo = async () => { try { const info = await DeepLinkInfoModule.getDeepLinkSourceInfo(); console.log('启动时的深度链接信息:', info); } catch (error) { console.error('获取深度链接信息失败:', error); } }; useEffect(() => { fetchLaunchDeepLinkInfo(); }, []);
获取浏览器跳转的Referer补充说明
如果是通过自定义URL Scheme从浏览器跳转,系统不会自动传递Referer,需要在跳转链接中手动附加参数,比如yourapp://open?target=xxx&referrer=https://example.com/page。之后在原生模块的getDeepLinkSourceInfo方法中解析参数:
if (launchURL) { NSURLComponents *components = [NSURLComponents componentsWithURL:launchURL resolvingAgainstBaseURL:NO]; for (NSURLQueryItem *item in components.queryItems) { if ([item.name isEqualToString:@"referrer"]) { sourceInfo[@"referrer"] = item.value; break; } } }
内容的提问来源于stack exchange,提问作者Jasper
相关产品推荐
相关产品推荐

