диплинки для мобильного приложения
От веба до приложения за один DeepLink
Android-приложения являются отражением сайта или сервиса и зачастую представляют собой сходный функционал в удобной оболочке. Из-за этого становится насущным вопрос навигации между страничкой в вебе и установленным клиентом. Для решения этой проблемы были изобретены диплинки (deeplink). Под катом вас ждёт увлекательная история о том, как мы внедряли их у себя и обрабатывали случай, когда у пользователя ещё не было установлено наше приложение.
Диплинки были придуманы так давно, что сейчас уже сложно представить приложение без них. Сама по себе технология не требует свежего Android API, однако если допиливать App Indexing, то можно столкнуться с тем, что работает оно с API 17.
Вернёмся к диплинкам. Их конфигурация представляет собой набор настроек для intent-filter в манифесте приложения, которые описывают паттерны поддерживаемых ссылок.
После этих нехитрых манипуляций при каждом нажатии на ссылку, удовлетворяющую настройкам фильтра, пользователю предлагается выбор между несколькими приложениями, в том числе и вашим. Далее активити, для которой мы задали intent-filter, получит Intent, содержащий в себе линк. Если достать его методом Intent#getData и распарсить необходимые параметры, то можно направить пользователя сразу в интересующий раздел.
После реализации может возникнуть вполне резонный вопрос: что делать, если у пользователя ещё нет приложения? Ответом будут особые диплинки, которые в этом случае умеют направлять человека в Маркет. При должном усердии такую ссылку можно генерировать самим, но нет никаких гарантий, что она будет работать со всеми браузерами и на всех версиях Android. Сейчас довольно много сервисов, предлагающих решение по крайней мере части этих проблем, например, AppsFlyer с их OneLink или Firebase с DynamicLink. Все они работают примерно одинаково, только DynamicLink использует для обработки диплинков предустановленные сервисы Google.
OneLink
Сам по себе OneLink ведёт на серверы AppsFlyer; они определяют, с какого устройства пользователь вышел в сеть, и перенаправляют его на соответствующий адрес. Можно задать редиректы для десктопа, Android и iOS. Когда Android-приложение установлено, линк прилетает в него через Intent как обычный диплинк. Когда приложения нет, в работу вступают Google Chrome и Google Play.
Наличие приложения проверяется браузером. У Chrome есть спецификация особого формата ссылок, которые потом конвертируются им в Intent и отправляются в систему. Она предусматривает задание ссылки на Google Play в случае, если приложение не установлено. Подробнее с ней можно ознакомиться тут.
Вообще в Google Play можно передать ссылку на приложение таким образом, чтобы после установки и запуска он прокинул часть её дальше. Это реализуется с помощью query-параметра url и будет выглядеть примерно так:
В этом случае best.memes/jokes попадёт внутрь приложения после его установки в виде диплинка. По умолчанию AppsFlyer работает не так: он предлагает получить ссылку через интерфейс библиотеки. Сам диплинк при этом, видимо, передаётся в приложение через серверы сервиса.
Это очень неудобно, потому что, во-первых, мы не можем понять наверняка, надо ли нам ждать какие-то параметры или пользователь просто тыкнул в иконку и параметров не будет. Во-вторых, мы хотим сразу открывать нужный раздел приложения, без лишних блокировок и ожиданий. AppsFlyer же предлагает открывать главный экран, а когда пришли (и если пришли) параметры, то редиректить. Нас такой подход не устроил, поэтому мы сгенерировали свой url в Google Play с параметром для случая, когда пользователь переходит по диплинку с Android-устройства и у него нет приложения. Его мы задали в Onelink, чтобы получать диплинк в приложении без необходимости дожидаться библиотеку.
OneLink работал отлично, пока мы не попробовали пошарить его в Slack. Дело в том, что он открывает ссылки в своём встроенном браузере через Chrome Custom Tabs. Если коротко, то это вкладка браузера, которая открывается в процессе вашего приложения и может быть кастомизирована, чтобы не выбиваться из общего стиля (подробнее можно почитать тут). В этом случае откроется веб-версия Google Play и диплинк в приложение после установки проброшен не будет. Аналогично браузер ведёт себя, если руками скопировать OneLink в адресную строку и перейти по ссылке. Об этом случае разработчики Chrome писали в Release Notes несколько версий назад. Суть в том, что при таком подходе в браузере не срабатывает редирект в Google Play, когда приложение не установлено, и пользователь остаётся в вебе. Силами OneLink побороть это поведение не удалось, поэтому мы обратились к DynamicLink.
DynamicLink
Глубокая интеграция Google Play Services в систему позволяет им оптимизировать проверку наличия целевого приложения на устройстве. Это довольно закрытая экосистема, поэтому досконально разобраться в принципах её работы не удалось, однако всё указывает на то, что Chrome открывает активити с прогрессом, принадлежащую Google Play Services, которая определяет, как ей поступить с диплинком. После этого либо происходит редирект либо в Google Play, либо в приложение. При этом диплинк потом попадает в приложение через Intent, то есть без дополнительных библиотечных костылей.
Субъективно, такой подход функционирует не быстрее, чем OneLink, однако он работает при открытии ссылки в Chrome Custom Tabs, что является существенным преимуществом, потому что их используют многие приложения.
Кроме прочего, Firebase позволяет посмотреть схему работы ссылки и куда редиректится пользователь на каждой платформе в каждом случае. Выглядит это примерно так:
Выводы
OneLink. Целевое приложение установлено | OneLink. Целевое приложение НЕ установлено | DynamicLink. Целевое приложение установлено | DynamicLink. Целевое приложение НЕ установлено | |
---|---|---|---|---|
Ссылка открывается системой (ACTION_VIEW) | + | Пришлось «закостылить», чтобы получать диплинк сразу на старте | + | + |
Ссылка открывается в Chrome Custom Tabs | — | — | + | + |
По ссылке нажимают в браузере | + | Пришлось «закостылить», чтобы получать диплинк сразу на старте | + | + |
Ссылку копируют в адресную строку | — | — | + | + |
Из таблицы видно, что в реализации с DynamicLinks всё работает без костылей и во всех интересных нам случаях.
Что такое диплинк и как это создать
Владельцы коммерческих аккаунтов в соцсетях часто сталкиваются с потерей трафика. Это связано с тем, что ссылка на их профиль открывается в браузере. И чтобы пользователь смог подписаться на страницу или просмотреть пост, ему необходимо заново войти в аккаунт или скопировать логин из ссылки, вставить его в поиск по приложению — и только тогда попасть на нужную страницу.
За счет большого количества лишних действий конверсия ожидаемо снижается. Чтобы избежать подобных ситуаций, и используют диплинк. В этой статье мы подробно разберем, что такое deeplink и как с ним работать.
Содержание
Что такое диплинк
Deeplink, или диплинк — это гиперссылка, которая перенаправляет пользователя в конкретный раздел приложения или сайта. Эта функция сокращает количество промежуточных действий пользователя и помогает ему попасть на нужную страницу за минимальное количество кликов.
Зачем нужны диплинки
Глубинные ссылки — а именно так deeplink можно перевести с английского — актуальны для мобильного трафика. Они позволяют клиентам быстро перейти в нужное приложение, чтобы ознакомиться с предложением или изучить статью на вашей странице.
Очень часто SMM специалисты, таргетологи и маркетологи допускают одну и ту же ошибку — в рекламных объявлениях добавляют простые ссылки, да еще и без UTM меток. Получается, что они сами лишают себя возможности провести анализ по каналам переходов и — как следствие — не знают свою целевую аудиторию.
При переходе по обычной ссылке пользователю приходится совершать ряд бессмысленных действий, чтобы посмотреть товар в Инстаграме или подписаться на канал в мессенджере Телеграм. Таком образом, компания получает отказы, теряет трафик и сливает бюджет рекламной кампании.
Обратите внимание! Для каждого устройства нужно создавать в объявлениях удобные ссылки, по которым клиент сможет быстро переключаться между каналами и понимать, какие действия он должен совершить дальше.
Как работают диплинки
Принцип работы deeplink:
Если приложение не установлено на смартфоне, переход будет осуществлен в Google Play или App Store — в зависимости от того, на какой операционной системе работает ваш мобильный телефон: Android либо iOS.
Схема работы глубинной ссылки:
Схема, как работает deeplink
Виды deeplink
Как создать диплинк
А далее разберемся, в каких программах можно создавать deeplink.
Примечание! Если вы хотите самостоятельно заниматься глубинными ссылками, изучите гид для разработчиков.
Конструктор мультиссылок от SendPulse
Конструктор мультиссылок от SendPulse — инструмент для работы с несколькими ссылками. Позволяет настроить мобильный лендинг, мультиссылку для соцсетей или даже интернет-магазин.
Ниже приведен скриншот редактора мультиссылки — на нем слева расположены инструменты, а справа — настройки параметров. Вы можете добавить любое количество ссылок на соцсети и разделы сайта, чтобы пользователь мог сразу же перейти на нужные страницы и найти то, что его интересует. А также можно подключить форму подписки на чат-ботов в мессенджерах и на email и SMS рассылку.
Пример редактора в сервисе SendPulse
А здесь показан скриншот с настройками сайта — общие параметры доменного имени и добавление фавикона, SEO-оптимизация и раздел с аналитикой.
Раздел с настройками сайта — общие, оптимизация и аналитика
Особенности:
Плюсы:
Минусы:
Deeplinkr
Deeplinkr — популярный сервис для работы с глубокими ссылками. В бесплатной версии у вас есть возможность создать до 1000 диплинков. Платный доступ позволяет устанавливать свой URL и устанавливать количество кликов.
Ниже показан личный кабинет сервиса, в котором можно удобно управлять ссылками и отслеживать статистику.
Кабинет в сервисе Deeplinkr
Особенности:
Плюсы:
Минусы:
Простой, но мощный конструктор лендингов
Создайте мобильный лендинг, интернет-магазин или мультиссылку для Instagram и продвигайте ее через чат-боты в мессенджерах, email и SMS — все это на одной платформе!
ВMBE deeplink
ВMBE deeplink — генератор глубинных ссылок. Пробная версия позволяет совершить до 500 кликов по гиперссылке. Далее необходимо приобрести подписку.
На скриншоте ниже показан личный кабинет сервиса и пример того, как могут выглядеть глубинные ссылки.
Личный кабинет ВMBE deeplink
Особенности:
Плюсы:
Минусы:
Jusl — сервис, позволяющий быстро и без регистрации создать глубинную ссылку. Если вы хотите отслеживать статистику — подключите бота в Телеграм, оплатите подписку и работайте с аналитикой.
Ниже скриншот страницы сервиса — пример, как выглядит гиперссылка:
Работа сервиса Jusl
Особенности:
Плюсы:
Минусы:
Instadeep
Instadeep — платный сервис для работы с глубинными ссылками в Instagram. Есть пробная версия на семь дней.
Скриншот главной страницы сервиса:
Главная страница Instadeep
Чтобы воспользоваться сервисом, оплатите подписку или подключите бесплатный доступ. В открывшемся окне введите email и ссылку, с которой будете работать.
После подтверждения данных вы получите такой ответ:
Пример страницы с дальнейшими действиями по работе с сервисом
Робот обработает вашу заявку и пришлет на почту готовую ссылку:
Пример письма с готовым deeplink
Особенности:
Плюсы:
Минусы:
Surflink
Surflink — сервис для работы с гиперссылками. В бесплатной версии доступ ограничен. Платная подписка открывает больше возможностей — полная статистика по переходам, подключение своих доменов, неограниченное количество кликов, возможность задавать свои URL.
Скриншот личного кабинета в сервисе Surflink с готовой ссылкой:
Личный кабинет в Surflink
Страница для отслеживания статистики по переходам:
Пример страницы со статистикой
Особенности:
Плюсы:
Минусы:
Заключение
В этой статье мы разобрали, что такое диплинк и как с ним работать.
Важное замечание.Facebook Ads негативно относится к глубинным ссылкам — отключает объявления или накладывает ограничения, поэтому мы рекомендуем использовать только официальные инструменты FB.
А чтобы сделать более плавный переход между каналами — регистрируйтесь в сервисе SendPulse и подключайте наши инструменты: создавайте мультиссылку или лендинг, используйте CRM, отправляйте email рассылки, Viber, SMS, WhatsApp рассылки, а также подключайте чат-боты в мессенджерах Facebook Messenger, ВКонтакте, WhatsApp и Telegram!
Как настраивать диплинки: инструкция для Firebase, AppsFlyer и Facebook
На связи Алексей Поддубный, iOS-разработчик AGIMA. Я расскажу, как в iOS работают диплинки, и разберу тонкости настройки популярных сервисов: где создавать ссылки с динамическими параметрами, как настраивать конфигурацию приложений и что делать после настройки. Инструкции основаны на оригинальных туториалах, которые мы перевели и адаптировали.
Диплинки, или глубинные ссылки, часто используют в рекламных кампаниях соцсетей. Они нужны чтобы вовлекать новых пользователей или интегрировать приложения с различными источниками трафика. Такая ссылка отправляет пользователя сразу на определенный раздел или товар, который он увидел в рекламной компании без перехода в браузер.
Что такое глубинные ссылки?
Человек листал ленту Facebook и увидел рекламу: доставка бургеров за 15 минут. Он кликает по ссылке и попадает в браузер на главную страницу. Рекламных предложений с «быстрыми» бургерами там нет, а без авторизации написать менеджеру нельзя. В результате страница закрывается, человек остается голодным и недовольным, а бизнес недополучил прибыль.
Чтобы дать пользователю желаемое «здесь и сейчас» нужна глубинная ссылка — Deep Link. Или Deferred Deep Linking — отложенная глубинная ссылка — если приложение не установлено. В отложенном варианте пользователь сначала попадает в App Store или Play Market для Android, а после установки — в нужный раздел приложения.
Как можно использовать диплинки
Интегрировать в рекламные кампании и привлекать новых пользователей.
Переносить пользователей из веба в мобайл: после установки приложения можно продолжить работу сразу с того места, на котором человек остановился.
Перенаправлять с электронной почты или SMS-сообщений в приложение на нужный раздел или товар.
Обмениваться данными между пользователями: люди могут делиться между собой приглашениями установить приложение или ссылками на конкретный товар. С помощью диплинков можно отследить поведение пользователей и оптимизировать будущие маркетинговые кампании.
Сервисы для интеграции диплинков
Есть много сервисов по внедрению диплинков. Мы чаще всего используем Firebase, AppsFlyer и Facebook поэтому будем сравнивать их. Справедливости ради, можно обойтись и без сторонних сервисов, но в этой статье такой подход мы рассматривать не будем.
Firebase
AppsFlyer (OneLink)
Сервис содержит модуль для интеграции диплинков, Crashlytics, Аналитику, Push-уведомления и другие популярные модули
Мощный и легкий в использовании инструмент для настройки диплинков, отслеживания установок и аналитики
Механизм для настройки рекламных диплинков внутри продуктов Facebook
Для чего использовать
Для рекламных диплинков ведущих на веб- и мобильные устройства
Для рекламных диплинков, ведущих на веб- и мобильные устройства
Используется только в рекламных кампаниях Facebook и Instagram (сторис, лента)
+ Ссылки могут участвовать в поисковой индексации
+ Можно создать ссылку с динамическими параметрами, например когда каждому пользователю нужно выдать по ссылке с уникальным параметром
+Можно добавлять UTM-параметры
+ Работает на всех платформах
+ Гибкая настройка диплинков, можно указать множество дополнительных параметров
+ Есть OneLink API для создания персонализированных ссылок и автоматизации процесса
+ Возможно создавать ссылки с динамическими параметрами
+ Deferred Deeplink без проблем работает в последних версиях iOS
+ Позволяет интегрировать в рекламу Facebook
+ Удобно тестировать через тестовые устройства
— Настраивается только для мобильных приложений на базе iOS / Android
— Нет API для генерации ссылок
— Нет возможности настраивать рекламные кампании в консоли Firebase
— Тестирование возможно только через установку приложения Facebook Messenger
— Из-за изменений в iOS 14 отложенный переход по глубинной ссылке больше не поддерживается
Удобство ЛК для отслеживания аналитики
Можно отслеживать количество кликов по ссылке после установки приложения
Система отслеживания аналитики с множеством параметров: географическое распределение пользователей, источники трафика, установки по дням, переходы по ссылкам, показы, открытия приложения, показатели конверсии, неорганические и органические установки
Отображает и разделяет количество органических и неорганических установок. Показывает время последней установки на каждой из платформ iOS / Android
Дальше разберем, как интегрировать диплинки через описанные фреймворки.
#1: Настройка через Firebase
Создание ссылки в консоли Firebase
В консоли Firebase откройте раздел «Динамические ссылки». Создайте базовый домен, который будет использоваться в диплинках.
2. Нажмите на New Dynamic Link и перейдите к созданию диплинка.
Сформируйте вид короткой ссылки и нажмите Next.
3. Укажите ссылку, которая будет открываться у пользователей веба и в мобильном приложении. Правая часть ссылки — та, из которой будем извлекать параметры.
4. В следующем пункте укажите «Open the deep link in your iOS App» и выберите приложение из выпадающего списка.
5. Если ссылка будет использоваться для обеих платформ, то укажите и Android-приложение.
6. Укажите метатеги, UTM-метки или другие дополнительные параметры, нажмите «Сохранить».
Все, диплинк готов к дальнейшему использованию.
Конфигурация приложения
Откройте проект в Xcode и перейдите во вкладку Signing & Capabilities, допишите префикс applinks и добавьте ваш домен в Associated Domains.
Чтобы проверить правильность настройки, установите приложение на телефон и перейдите по ссылке в виде https://your_dynamic_links_domain/apple-app-site-association. В нашем случае — https://tr4d1.page.link/apple-app-site-association. После нажатия на ссылку вы должны попасть в приложение.
Для получения и обработки диплинков добавьте Firebase SDK.
1. Добавьте и установите Firebase SDK через cocoapods выполнив pod install.
2. Импортируйте модуль Firebase в AppDelegate
3. В методе application:didFinishLaunchingWithOptions: вызовите FirebaseApp.configure() для инициализации SDK.
4. Реализуйте метод для открытия диплинков если приложение уже установлено у пользователя.
Настройка Deferred Deep Link для случаев когда приложение не было раньше установлено:
Метод для обработки диплинка:
Опишем синглтон для хранения диплинка
Опишем базовый контроллер
Таким образом, когда пользователь переходит по короткой ссылке вида https://tr4d1.page.link/subscription, в обработчик попадает внутренняя ссылка https://deeplinkexample/subscription. После ее успешной обработки получается enumDeepLinkType.subscription, который можно использовать для открытия соответствующего раздела приложения.
#2: Настройка через AppsFlyer (Onelink)
Создание шаблона OneLink
1. Перейдите по ссылке https://hq1.appsflyer.com/onelink/setup?onelinkId=new создайте базовый шаблон и укажите его название.
2. Укажите поддомен, который будет использоваться в диплинках.
3. Из выпадающего списка выберите название приложения. Если ссылка будет использоваться для обеих платформ, то укажите и Android-приложение.
4. Настройте поведение ссылки для случаев если приложение не установлено. Здесь по умолчанию открывается приложение в AppStore, и этот параметр изменять не нужно, — он уже сконфигурирован на открытие приложения в AppStore.
5. Выберите действия, которые необходимо выполнить если приложение установлено. Здесь нужно изменить на запуск приложения с использованием Universal Links указав Team Id и Bundle Id приложения.
6. Если на вебе нужно открывать другую ссылку, а не перенаправлять пользователей в магазины приложений, укажите веб-ссылку. После этого шага нажмите «Сохранить» и перейдите к созданию самого диплинка.
Создание ссылки OneLink
1. Сформируйте вид короткий ссылки
2. Укажите название кампании
3. Добавьте дополнительные параметры атрибуции. Они могут быть предустановленными, например af_ad (имя рекламы), af_channel (канал рекламы) или свои собственные. Все параметры будут доступны в приложении после переходу по ссылке и ее обработки.
4. После добавления параметров сохраните ссылку. Диплинк готов к использованию. Ссылка доступна в коротком и длинном варианте.
Конфигурация приложения
Откройте проект в Xcode и перейдите во вкладку Signing & Capabilities, добавьте ваш домен в Associated Domains, дописав префикс applinks: по аналогии с конфигурацией Firebase.
Для получения и обработки диплинков необходимо добавить AppsFlyer SDK.
1. Добавьте и установите AppSlyer SDK через cocoapods выполнив pod install
2. Импортируйте модуль AppsFlyer в AppDelegate
В методе application:didFinishLaunchingWithOptions: установите appsFlyerDevKey и appleAppID
3. Реализуйте методы для извлечения ссылки и передачи ее в обработчик AppsFlyer
4. Также реализуйте методы SDK AppsFlyer onConversionDataSuccess и onAppOpenAttribution для обработки диплинков
Переходя по короткой ссылке вида https://tr4d1.onelink.me/Jvu2/subscription, в обработчик попадает развернутая ссылка https://tr4d1.onelink.me/Jvu2?pid=subscription&c=subscription&custom_value=1&af_ad=subscription. Все параметры этой ссылки находятся в словаре. Извлекая параметры, можно выполнить соответствующие действия в приложении.
Оригинал инструкции для AppsFlyer https://support.appsflyer.com/hc/en-us/articles/207032066-AppsFlyer-SDK-Integration-iOS#core-apis-get-conversion-data
#3: Настройка через Facebook
Конфигурация приложения
Откройте проект в Xcode и перейдите в Info.plist. Здесь необходимо добавить данные вашего приложения из Facebook.
Для получения и обработки диплинков необходимо добавить Facebook SDK.
1. Добавьте и установите Facebook SDK через cocoapods выполнив pod install.
2. Импортируйте модуль Facebook в AppDelegate.
3. В Facebook для любого вида диплинков используется всего один метод:
Диплинки в Facebook работают только при переходе по ним из рекламы. Для их тестирования нужно настроить тестовую рекламную кампанию. Скачать Facebook Messenger и авторизоваться под той же учетной записью, в которой настраиваются диплинки. Затем найти в ленте запись вашей рекламной кампании и нажать на нее для перехода по диплинку.
Откладка диплинков
Для тестирования и дебаггинга глубинных отложенных диплинков нужно удалить приложение с телефона. Перейти по диплинку и попасть в AppStore на страницу приложения, но не скачивать его. После чего установить приложение через Xcode на девайс, установить брейкпоинты на методах извлечения диплинков соответствующих SDK и произвести отладку.
Для отладки обычных отложенных диплинков, когда приложение уже установлено и выполняется просто переход по ссылке, нужно предварительно установить приложение через Xcode, но не запускать его. Это делается с помощью нажатия Option+Cmd+R. Откроется окно, в котором нужно поставить галочку Wait for the executable to be launched.
В данном случае Xcode установит приложение, но будет ждать на открытие его пользователем. Далее так же установите брейкпоинты на нужных методах и перейдите по диплинку.
Рекомендации
Детально тестируйте каждую ссылку на открытие нужного раздела или продукта в приложении перед отправкой новой версии приложения с AppStore. Это экономит время на более быстрый старт будущих рекламных кампаний.
При добавлении каждого SDK или новой ссылки проверьте поведение ссылки при установленном приложении и, если оно отсутствует.
Интегрируйте сразу несколько SKD в одно приложение, например Facebook, Firebase и AppsFlyer. Тогда нужно смотреть чтобы добавление нового, не сломало работоспособность предыдущего. В таком случае хорошо иметь один обработчик, который будет вызываться каждым SDK.