konstantinbueschel
9/20/2013 - 9:38 AM

URL schemes for iOS and Android (2/2)

URL schemes for iOS and Android (2/2)

<intent-filter>
    <action android:name="android.intent.action.VIEW"/>
    <category android:name="android.intent.category.DEFAULT"/>
    <category android:name="android.intent.category.BROWSABLE"/>
    <data android:scheme="http" android:host="myapp.com" android:path="/view" />
</intent-filter>
<meta name="apple-itunes-app" content="app-id=1234567, app-argument=myapp://view?id=123"/>
function open() {
    
    // If it's not an universal app, use IS_IPAD or IS_IPHONE
    if (IS_IOS) {
        window.location = "myapp://view?id=123";
    
        setTimeout(function() {
    
            // If the user is still here, open the App Store
            if (!document.webkitHidden) {
    
                // Replace the Apple ID following '/id'
                window.location = 'http://itunes.apple.com/app/id1234567';
            }
        }, 25);
    
    } else if (IS_ANDROID) {
    
        // Instead of using the actual URL scheme, use 'intent://' for better UX
        window.location = 'intent://view?id=123#Intent;package=my.app.id;scheme=myapp;launchFlags=268435456;end;';
    }
}
var IS_IPAD = navigator.userAgent.match(/iPad/i) != null,
    IS_IPHONE = !IS_IPAD && ((navigator.userAgent.match(/iPhone/i) != null) || (navigator.userAgent.match(/iPod/i) != null)),
    IS_IOS = IS_IPAD || IS_IPHONE,
    IS_ANDROID = !IS_IOS && navigator.userAgent.match(/android/i) != null,
    IS_MOBILE = IS_IOS || IS_ANDROID;
<?

// Settings
$scheme = 'myapp';
$ios_id = 1234567;
$android_package = 'my.app.id';
$auto = false;

// No trailing slash after path, conform to http://x-callback-url.com/specifications/
$REQUEST_URI = preg_replace('@/(?:\?|$)@', '', $_SERVER['REQUEST_URI']);

// Detection
$HTTP_USER_AGENT = strtolower($_SERVER['HTTP_USER_AGENT']);
$android = (bool) strpos($HTTP_USER_AGENT, 'android');
$iphone = !$android && ((bool) strpos($HTTP_USER_AGENT, 'iphone') || (bool) strpos($HTTP_USER_AGENT, 'ipod'));
$ipad = !$android && !$iphone && (bool) strpos($HTTP_USER_AGENT, 'ipad');
$ios = $iphone || $ipad;
$mobile = $android || $ios;

// Install
$ios_install = 'http://itunes.apple.com/app/id' . $ios_id;
$android_install = 'http://play.google.com/store/apps/details?id=' . $android_package;

// Open
if ($ios) {
    $open = $scheme . ':/' . $REQUEST_URI;
}
if ($android) {
    $open = 'intent:/' . $REQUEST_URI . '#Intent;package=' . $android_package . ';scheme=' . $scheme . ';launchFlags=268435456;end;';
}

?>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>URL Schemes</title>
        <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <? if ($ios): ?>
            <meta name="apple-itunes-app" content="app-id=<?= $ios_id ?>, app-argument=<?= $open ?>"/>
        <? endif ?>
    </head>
    <body>

        <script>
        function open() {
            window.location = '<?= $open ?>';

            <? if ($ios): ?>
                setTimeout(function() {
                    if (!document.webkitHidden) {
                        window.location = '<?= $ios_install ?>';
                    }
                }, 25);
            <? endif ?>
        }
        </script>

        <? if ($mobile): ?>
    
            <? if ($ios): ?>
                <p>Click the banner on top of this screen to <a href="<?= $ios_install ?>">install</a> our app or directly <a href="<?= $open ?>">open</a> this content in our app if you have it installed already.</p>
    
            <? elseif ($android): ?>
                <p>Go ahead and <a href="<?= $android_install ?>">install</a> our app or directly <a href="<?= $open ?>">open</a> this content in our app if you have it installed already.<p>
            <? endif ?>

            <? if ($auto): ?>
                <script>open();</script>
            <? endif ?>

        <? else: ?>
            <p>Go to the <a href="<?= $ios_install ?>">App Store</a> or <a href="<?= $android_install ?>">Google Play</a> to install and open this content in our app.</p>
        <? endif ?>

    </body>
</html>

URL schemes for iOS and Android (2/2)

Read the blog at http://fokkezb.nl/2013/09/20/url-schemes-for-ios-and-android-2/