How to make website URL work as prefix in React Navigation

Viewed 1059

What I'm trying to do

I'm currently trying to setup deep linking into my React Native app. I'm creating a share functionality so that the user can show his friends a page inside my app. I want the same behaviour when you click a link of Netflix or Spotify - It directly opens the app even if it was closed.

What I already done

In order to do that, I created a Nextjs web application to give my links some good-looking meta tags.

Also, I have configured my Navigator using React Navigation v5.

const config = {
    screens: {
        Feed: {
            screens:{
                LocalInside: "share/:localId"
            }
        },
        Ranking: 'ranking'
    },
};

const linking = {
    prefixes: ['https://[myapp]-web.vercel.app', '[myapp]://'],
    config,
};
...
<NavigationContainer linking={linking}>

Note: Both links have the same suffix, that is "/share/:localID"

The problem

Finally, I learned that in order to test the deep link I could use uri-scheme so I ran

npx uri-scheme open [myapp]://share/[someLocalID] --android

It worked. But I couldn't get my vercel.app link to work. Not on Android Browser, neither using uri-scheme.

So I want to know how can I make my Nextjs website URL directly open my app the same way the uri-scheme command does.

0 Answers
Related