Mi aplicación, que se creó con React Native, requiere la funcionalidad para escanear el código QR con la aplicación de cámara predeterminada y luego abrir una pantalla específica en la aplicación. Para lograr esto, configuro los enlaces dinámicos de Firebase utilizando también la biblioteca React Native Firebase.
La configuración fue bastante simple, un enlace dinámico usando el dominio proporcionado por Firebase, el enlace también contiene un enlace profundo en formato de URL https://example.page.link/abc-xyz
.
Después de que la aplicación escanee el QR, use la URL de enlace profundo para extraer la parte abc-xyz
y navegar a una pantalla diferente, aquí está mi implementación.
// App.js const handleDynamicLink = link => { const linkCheck = new RegExp('^https://example.page.link/.*$'); let title; if (linkCheck.test(link.url)) { title = link.url.substring(link.url.lastIndexOf('/') + 1).split('-'); RootNavigation.navigate(Screens.offer, { title: title }); } }; ... React.useEffect(() => { // Handler for background/quit events dynamicLinks().getInitialLink().then(link => { handleDynamicLink(link); }); // Handler for foreground events const unsubscribe = dynamicLinks().onLink(handleDynamicLink); return () => unsubscribe(); }, []); // RootNavigation.js import * as React from 'react'; export const navigationRef = React.createRef(); export function navigate(name, params) { navigationRef.current?.navigate(name, params); }
Toda la configuración necesaria ya está configurada tanto para iOS como para Android, haciendo una prueba con el dispositivo Android escaneando el código QR, reconoce el enlace y navega a la pantalla deseada, pero no para iOS a pesar de que entiende el enlace y solo abre la pantalla inicial. detente ahí.
Lo extraño es que si abro el enlace directamente en el navegador del dispositivo, se abrirá la página de vista previa, luego, si hago clic en el botón "abrir", se abre la aplicación y se navega a la pantalla de destino.
¿Se pregunta si esto tiene algo que ver con las cosas de navegación en el lado nativo de iOS?
Resulta que necesito actualizar AppDelegate.m
y agregar un controlador de enlace para iOS.
Se agregó el siguiente código sobre la línea @end
en AppDelegate.m
.
// AppDelegate.m - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options { return [RCTLinkingManager application:application openURL:url options:options]; } - (BOOL)application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity restorationHandler:(nonnull void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler { return [RCTLinkingManager application:application continueUserActivity:userActivity restorationHandler:restorationHandler]; }
Manejo cuando la aplicación está en primer plano o ya está abierta.
// App.js if (Platform.OS === 'ios') { Linking.addEventListener('url', handleDynamicLink); }
Manejo cuando la aplicación está completamente cerrada/iniciada por enlace dinámico.
// App.js if (Platform.OS === 'ios') { Linking.getInitialURL() .then(link => { handleDynamicLink({ url: link }); }) .catch(error => { // Error handling }); } else { // This part for Android dynamicLinks().getInitialLink().then(link => { handleDynamicLink(link); }); }