Deeplinking  (how to force out of Facebook's in-app browser and fallback on desktop)

Deeplinking (how to force out of Facebook's in-app browser and fallback on desktop)

So it turns out these in-app web views can't die quick enough (hello, SafariViewController!). Marty tweeted he was trying to get YouTube videos to open in the native iOS app rather than on the website but was finding it impossible.

By default, the iOS app adds a URL scheme to open youtube.com links. When someone texts you a link to a video, Safari will redirect you to the app. However, Facebook's in-app browser (and Twitter's and I expect others) doesn't honour this and linking to the youtube:// URL scheme doesn't work either.

Workaround With JavaScript

It turns out, if you redirect to the youtube:// URL from another page, that'll force you out of these web views. We can also use this to fallback to the website which works great on desktop and mobile devices where YouTube isn't installed.

I first tried a quick redirect workaround in PHP by just redirecting using header('Location: youtube://blahblahblah'). It worked, but if the user didn't have YouTube installed they were instead displayed an error telling them that iOS had no idea what to do with the link.

Turns out it's pretty easy to do it in JS though.

The various fallbacks will be called if not on iOS or Android, or if the user doesn't have YouTube (or whatever other app installed).

Try It…

This can be used for any deep linking. For example you could swap this out and use the instagram:// URL scheme to natively open Instagram. Or perhaps you want to open Tweetbot? Use tweetbot://.

✌️

About Stephen Radford

Software Engineer. I take a few photos when I'm not stuck behind a keyboard too.

Leicester, UK http://stephenradford.co.uk

Comments