Почему не работает эта глубокая ссылка (applink), сгенерированная Facebook?

Я хочу сделать кнопку на своем веб-сайте, которая позволит пользователю открывать нативное приложение facebook (если оно установлено) или открывать веб-сайт facebook в противном случае. Как я понял, я должен создать отдельную HTML-страницу для этого.

Я попробовал размещенные на Facebook ссылки на приложения, чтобы получить работающий пример ссылок на приложения. Следующий код был сгенерирован Facebook, к нему можно получить доступ по этому URL.

Я пытался открыть эту ссылку с iOS (Safari, Chrome), Android (браузер по умолчанию, Chrome). Несмотря на то, что у меня на обоих устройствах установлено приложение Facebook, я перенаправлен на сайт Facebook.

Почему это происходит? Как я могу сделать это открыть нативные приложения?

<html>
    <head>
        <title>App Link</title>
        <meta property="fb:app_id" content="505860159524932" />
        <meta property="al:ios:url" content="fb://profile/838619192839881" />
        <meta property="al:ios:app_name" content="Facebook" />
        <meta property="al:ios:app_store_id" content="284882215" />
        <meta property="al:android:package" content="com.facebook.katana" />
        <meta property="al:android:app_name" content="Facebook" />
        <meta property="al:android:url" content="fb://page/838619192839881" />
        <meta property="al:web:should_fallback" content="false" />
        <meta property="al:web:url" content="https://www.facebook.com/warpcompany" />
        <meta http-equiv="refresh" content="0;url=https://www.facebook.com/warpcompany" />
    </head>
    <body>Redirecting...</body>
</html>

2 ответа

AppLinks - это протокол, который поддерживается только в Facebook. Это означает, что только собственные приложения Facebook для Android и iOS будут правильно анализировать метатеги и предпринимать действия. Все остальные браузеры и платформы игнорируют их.

Чтобы правильно обрабатывать ссылки в других браузерах, вы используете код перенаправления JS на стороне клиента в дополнение к AppLinks для поддержки перенаправления в других браузерах. Если вы не хотите создавать все это, я создал бесплатный инструмент под названием https://branch.io/, который будет размещать ваши ссылки с этим JS на стороне клиента, а также автоматически настраивать ваши AppLinks.

Если вы хотите собрать его самостоятельно, вот код, который вы можете использовать для iOS-сафари:

<script type="text/javascript">
    window.onload = function() {
        document.getElementById("l").src = "fb://page/838619192839881";

        setTimeout(function() {
            window.location = "itms-apps://itunes.apple.com/app/id284882215";
        }, 750);
    };
</script>
<iframe id="l" width="1" height="1" style="visibility:hidden"></iframe>

А для Android вы можете использовать этот фрагмент кода JS на стороне клиента:

<script type="text/javascript">
    window.onload = function() {
        var method = 'iframe';
        var fallbackFunction = function() {
            if (method == 'iframe') {
                window.location = "market://details?id=com.facebook.katana";
            }
        };
        var addIFrame = function() {
            var iframe = document.createElement("iframe");
            iframe.style.border = "none";
            iframe.style.width = "1px";
            iframe.style.height = "1px";
            iframe.src = "fb://page/838619192839881";
            document.body.appendChild(iframe);
        };
        var loadChromeIntent = function() {
            method = 'intent';
            document.location = "intent://page/838619192839881#Intent;scheme=fb;package=com.facebook.katana;end";
        };
        if (navigator.userAgent.match(/Chrome/) && !navigator.userAgent.match("Version/")) {
            loadChromeIntent();
        }
        else if (navigator.userAgent.match(/Firefox/)) {
            window.location = "fb://page/838619192839881";
        }
        else {
            addIFrame();
        }
        setTimeout(fallbackFunction, 750);
    };
</script>

док Facebook говорит

Ссылки на приложения - это открытый стандарт, позволяющий делать глубокие ссылки на контент в вашем приложении. Когда кто-то, использующий ваше приложение, делится контентом через Facebook (или другое приложение с поддержкой ссылок на приложения), вы можете создать ссылку, которая позволит перейти назад в ваше приложение из этого фрагмента контента.

так что я думаю, что, как сказал @Ming Li, он не поддерживает Safari и Chrome.

Вы можете попробовать это на своей временной шкале и использовать приложение Facebook, чтобы открыть его.

Другие вопросы по тегам