Можно ли реализовать глубокие ссылки с веб-сайта в нативное приложение?

У меня на сайте есть три кнопки, которые ведут на страницы Facebook, Twitter и vk.com. Я хочу открыть собственное приложение, если оно установлено на пользовательском устройстве. В противном случае я хочу, чтобы резервный URL-адрес был открыт.

Прежде всего, я попытался использовать нативные схемы приложений напрямую с deep-link.js. плагин. Но когда я попытался открыть схему URL-адреса собственного приложения, когда собственное приложение не было установлено, Safari показал ошибку, но, наконец, открыл резервную страницу URL-адреса. Браузер Android по умолчанию сказал, что не знает, как обращаться с такой схемой URL:

<a class="btn btn-primary" href="https://www.facebook.com/warpcompany" data-app-ios="fb://profile/838619192839881" data-app-android="fb://page/838619192839881">Facebook</a>

Затем я попытался использовать «стандартные» ссылки на приложения, которые так активно рекламируются в Facebook. Я даже пытался использовать их ссылки на размещенные приложения, чтобы убедиться, что я сгенерировал все правильно. Это не работает, он всегда перенаправляет на запасной сайт. Вы можете легко проверить это самостоятельно с https://fb.me/746134728830806.

Можно ли предоставить глубокую ссылку на веб-сайте, которая будет открывать собственное приложение без ошибок, по крайней мере, в браузерах ОС по умолчанию, или автоматически возвращаться к URL-адресу?


person avasin    schedule 19.05.2015    source источник


Ответы (3)


Это по-прежнему возможно, но в более новых версиях браузера Android по умолчанию вам придется использовать намерения, а не просто пытаться открыть глубокую ссылку. Например, замените fb://page/838619192839881 на

intent://page/838619192839881#Intent;scheme=fb;package=com.facebook.katana;end

По умолчанию это будет откат к Google Play, но вы можете переопределить откат, добавив S.browser_fallback_url:

intent://page/838619192839881#Intent;scheme=fb;package=com.facebook.katana;S.browser_fallback_url=http%3A%2F%2Fwww.facebook.com%2F;end

Резервный URL должен быть закодирован.

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

Я работаю над HOKO, это бесплатный, простой и удобный способ заставить все работать на Android и iPhone, и мы сделали вся грязная работа вокруг этого. Вы можете использовать его или просто напишите нам, и мы поможем вам.

person Ricardo Otero    schedule 13.07.2015

Принятый ответ будет работать только в Chrome v28 и браузерах по умолчанию для Android 5.0. Если вы хотите, чтобы это работало в других браузерах, таких как веб-просмотры Facebook/Twitter, Firefox, UC и более старых браузерах по умолчанию, чем 5.0, вам нужно использовать немного более сложный код.

Добавьте эту функцию в свой фрагмент JS:

    var openSesame = 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);
    };

Тогда ваша кнопка будет выглядеть так:

<a href="" onclick="openSesame();">Open the App</a>

Или вы можете использовать такую ​​службу, как branch.io, которая автоматически выполняет именно то, что вы ищете.

person Alex Austin    schedule 15.07.2015
comment
Не работало, пока я не поставил return false после openSesame(); в onclick. Другой способ — вернуть false из функции openSesame и поместить return openSesame() в onclick. Теперь это работает, спасибо! - person jox; 14.06.2017

Да, это так! Взгляните на это обучение: https://developer.android.com/training/app-indexing/deep-linking.html

Это та информация, которая вам была нужна? ЛМК

person Mann    schedule 19.05.2015
comment
Спасибо за ответ. В этом документе показано, как настроить манифест приложения. Я ищу способ, как вызвать глубокие ссылки с обычной веб-страницы. Проблема в том, что вы не можете просто использовать native://url, потому что в браузерах мобильных операционных систем по умолчанию это приводит к ошибкам. - person avasin; 20.05.2015
comment
О, ладно, извините... я думал, что это тема для Android. - person Mann; 20.05.2015