How to open a specific video in Facebook app using deep linking in React Native iOS?

Question

I'm trying to implement an app-to-app flow for playing Facebook videos in my iOS app. I'm using the URL scheme fb://video/{video_id} to open the Facebook app with the specific video, but the video doesn't actually play, and only the Facebook app's video page is shown.

I've tried using different variations of the URL scheme, including fb://facewebmodal/f?href=https://www.facebook.com/{video_id} and fb://watch/video?id={video_id}, but none of them seem to work.

I'm running my app on an iOS device with the latest version of the Facebook app installed. Is there a different URL scheme that I should be using?

My code is(It's working fine on android):

const handlePlayFacebookVideo = async (sourceUrl) => {
    const videoId = getFacebookVideoId(sourceUrl)

    try {
        const scheme = Platform.select({ ios: 'fb://', android: 'fb://facewebmodal/f?href=' });
        const url = Platform.select({ ios: `${scheme}video/?id=${videoId}`, android: `${scheme}${encodeURIComponent(sourceUrl)}` });
        
        const supported = await Linking.canOpenURL(url);
        if (supported) {
            await Linking.openURL(url);
        }
        if (!supported) {
            await Linking.openURL(sourceUrl);
        }

    } catch (error) {
        console.log('Error playing Facebook video:', error);
    }
}

Any help or guidance would be greatly appreciated. Thank you!

Answer 1

By chance, I noticed that when I send the same URL that works on the web, if the device has Facebook app installed, it opens it. If not, the browser also shows it.

So according to my code it worked like this

await Linking.openURL(sourceUrl);