iOS 9 safari iframe src with custom url scheme not working

Question

I use this solution https://gist.github.com/davidwkeith/2662899 to redirect from web page into my app if app installed. But it doesn't work on iOS 9. It's still working in Google-chrome. But iframe with custom URL scheme can't launch the application from Safari.

If I replace

document.getElementById('loader').src = 'custom-protocol://my-app'

(where loader is iframe) with

window.location = 'custom-protocol://my-app'

it will work.

os: iOS 9 beta4 and beta5

Anybody knows this problem? Is it iOS 9 beta bug? Or it will not be fixed?

Answer 1

The previous answer is a partial implementation of Universal Links that is missing critical details and doesn't include a fallback to the App Store.

First, you can no longer set iframe src in order to trigger a URI scheme. You've correctly identified that issue. As you noted, you can, however, still set window.location = 'custom-protocol://my-app';. So if you know that a user has your app because you've previously opened their app from the browser and have a cookie stored that can be looked up on your backend, you can still safely fire custom-protocol://.

Second, you can detect the user agent string using navigator.userAgent. Pre-iOS 9 you can still use the iframe to fire a URI scheme, then fallback after a timeout. On iOS 9, you can choose whether to fire the URI scheme or not based on cookies, then take the user to the App Store. I work on this at Branch and making use of cookies to recall whether a user likely has the app is something we've implemented. Feel free to reach out if you have more questions about that, or make use of our solution directly.

---

Implementing Universal Links is not quite as simple as the other answer describes. In reality, there is considerably more complexity. Here's a complete list of steps (I've helped several apps integrate in recent weeks using these steps):

1. Configure your app to register approved domains

i. Registered your app at developer.apple.com if you haven't

ii. Enable ‘Associated Domains’ on your app identifier on developer.apple.com

iii. Enable ‘Associated Domain’ on in your Xcode project

iv. Add the proper domain entitlement, applinks:yourdomain.com, in your app

2. Configure your website to host the ‘apple-app-site-association’ file

i. Buy a domain name or pick from your existing

ii. Acquire SSL certification for the domain name (you can use CloudFlare for this!)

iii. Create structured ‘apple-app-site-association’ JSON file

{
   "applinks": {
       "apps": [ ],
       "details": {
           "TEAM-IDENTIFIER.YOUR.BUNDLE.IDENTIFIER": {
               "paths": [
                   "*"
               ]
           }
       }
   }
}

iv. Sign the JSON file with the SSL certification

v. Configure the file server

The apple-app-site-association file: - must be sent with the header ‘application/pkcs7-mime’ - must be sent from the endpoint youdomain.com/apple-app-site-association - must return a 200 http code.

Example Express+Node:

var aasa = fs.readFileSync(__dirname + '/static/apple-app-site-association');
app.get('/apple-app-site-association', function(req, res, next) {
     res.set('Content-Type', 'application/pkcs7-mime');
     res.status(200).send(aasa);
});

credit: borrowed liberally from this blog post