Use Deeplink from WebView

SDK Version: 42
Platforms : Android/iOS

Hi guys, I’m trying to use DeepLinks with expo … Basically I open a WebView, my user is doing a whole process inside this WebView and must be redirected to my app.

Here is how I try to capture the event, with Linking.addEventListener ():


import React, { useEffect, useState } from 'react';
import { Platform, View } from 'react-native';
import { WebView } from 'react-native-webview';
import { useRoute } from '@react-navigation/native';
import * as Linking from 'expo-linking';
import { EAppColors } from '@shared/constants/appColors';
import { identification } from '@shared/resolvers/queries/identification';
import { fetchApi } from '../../services/fetchApi';
import { Camera } from 'expo-camera';

// interface IUbbleProps {}


const handleOpenUrl = (event: any) => {
  console.log('event url', event.url);
};

const Ubble: React.FunctionComponent = () => {
  const route = useRoute();
  const [hasPermission, setHasPermission] = useState('');

  const [identificationUrl, setIdentificationUrl] = useState(
    route.params?.identificationUrl,
  );

  const handleIdentification = async () => {
    identification(fetchApi)().then(res => {
      console.log(
        ':rocket: ~ file: Ubble.tsx ~ line 27 ~ handleIdentification ~  data ',
        JSON.stringify(res.status),
      );
    });
  };

  useEffect(() => {
    (async () => {
      const { status } = await Camera.requestPermissionsAsync();
      console.log(':rocket: ~ file: Ubble.tsx ~ line 38 ~ status', status);
      setHasPermission(status);
    })();
  }, []);
  useEffect(() => {
    setInterval(() => {
     // handleIdentification();
      if (Platform.OS === 'android') {
        Linking.getInitialURL().then(url => {
          console.log(url);
        });
      } else {
        Linking.getInitialURL().then(url => {
          //   console.log(url);
        });
        Linking.addEventListener('url', function handleOpenUrl(event: any) {
          console.log('event url', event.url);
        });
      }
    }, 1000);
  }, []);

  return (
    <View style={{ flex: 1, backgroundColor: EAppColors.WHITE }}>
      <WebView source={{ uri: identificationUrl }} allowsInlineMediaPlayback />
    </View>
  );
};

The problem is that I do not receive any events … How can I use Deeplinks with a WebView and redirect to my app from that WebView?

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.