Просмотр в приложении с помощью встроенного веб-браузера

Браузеры, встроенные в приложения, позволяют пользователям просматривать веб-страницы, не выходя из приложения. В Android есть два основных API для реализации таких браузеров: пользовательские вкладки и компоненты WebView. Используйте встроенный браузер, если у вас есть ссылка или объявление, ведущие на веб-страницу. Вы можете открыть эту страницу прямо в приложении, как показано на рисунке 1.

Ссылка в приложении, выделенная красным прямоугольником, и стрелка, указывающая на другой экран, на котором показана ссылка, открытая в специальной вкладке.
Рисунок 1. Нажатие на ссылку в приложении (слева) и открытие встроенного браузера с помощью специальной вкладки (справа).

Выбор между пользовательскими вкладками и WebView – это важное архитектурное решение, которое влияет на скорость разработки, удобство использования и степень контроля над интерфейсом.

Краткое сравнение

В таблице ниже приведены сведения, которые помогут вам выбрать подходящий инструмент.

Функция WebView Пользовательские вкладки
Основной пример использования Создание гибридных приложений, в которых веб-страницы используются для показа основного или дополнительного контента, медийной рекламы, кампаний для приложений или условий использования. Показ контента с внешних сайтов (например, новостных статей или страниц товаров).
Элемент управления пользовательского интерфейса Полный. Это компонент View, который можно разместить в любом месте. Вы управляете всем окружающим интерфейсом. Ограниченный доступ. Вы можете выбрать цвет панели инструментов и добавить несколько настраиваемых действий.
Данные и сеансы Изолированная среда. Оно не использует файлы cookie и учетные данные из основного браузера пользователя. Общий доступ. При этом используется сеанс браузера по умолчанию, включая файлы cookie и сохраненные пароли.
Мост между нативным приложением и веб-страницей Да. Вы можете использовать мост JavaScript для глубокого двустороннего взаимодействия между веб-контентом и кодом нативного приложения. Ограниченный доступ. Для передачи базовых строк можно использовать метод window.postMessage().
Усилия разработчиков Высокий. Вам нужно самостоятельно управлять жизненным циклом, навигацией и производительностью. Низкая. Чтобы его интегрировать, нужно добавить всего несколько строчек кода.

WebView

WebView – это представление, которое делает веб-страницы неотъемлемой частью макета приложения. Это мощный инструмент, но он сложнее в использовании, чем специальные вкладки.

WebView может загружать удаленный или локальный веб-контент, выполнять код JavaScript и обеспечивать двустороннюю связь между веб-контентом и кодом нативного приложения. Подробнее о возможностях WebView…

Вы также можете использовать WebView, чтобы показывать веб-приложение или веб-страницу в своем приложении, например пользовательское соглашение, которое нужно периодически обновлять. Подробнее о том, как создавать веб-приложения в WebView…

Почему стоит выбрать WebView

Ниже приведены примеры ситуаций, в которых WebView – подходящее решение.

  • Гибридные приложения. Вы создаете приложение, в котором веб-контент и нативные компоненты (например, панель навигации или плавающая кнопка действия) находятся рядом.
  • Собственный контент. Веб-контент является основной интерактивной частью приложения, например редактором документов или холстом для рисования.
  • Полный контроль над элементами управления пользовательского интерфейса. Вам нужно изменить контент веб-страницы или наложить на нее элементы интерфейса.
  • Глубокая аналитика. Вам нужна подробная статистика о вовлеченности и действиях пользователей в WebView.

Основные компромиссы

Ниже приведены некоторые ключевые компромиссы, которые следует учитывать при использовании WebView:

  • Производительность. WebView может потреблять много памяти. Если не уделить этому достаточно внимания, могут возникнуть проблемы с производительностью или ошибки ANR (приложение не отвечает).
  • Безопасность и обслуживание. Вы отвечаете за усиление безопасности и управление жизненным циклом. В частности, необходимо управлять сохранением состояния при повторном создании процесса с помощью WebViewCompat.saveState() и не превышать лимит Android на транзакции сохраненного состояния, равный 1 МБ. Однако обновления WebView выпускаются по всему миру через Google Play, поэтому вам не нужно беспокоиться о том, что базовый движок устареет.

Пользовательские вкладки

Специальные вкладки – отличный способ перенаправлять пользователей на внешние URL. Они представляют собой быстрое, безопасное и удобное окно браузера, которое открывается поверх приложения.

Почему стоит выбрать пользовательские вкладки

Ниже приведены некоторые сценарии, в которых пользовательские вкладки подходят:

  • Внешние ссылки. Когда пользователь нажимает на ссылку, ведущую на сайт, который вам не принадлежит, пользовательские вкладки позволяют ему оставаться в контексте вашего приложения, предоставляя при этом все возможности полнофункционального браузера.
  • Простота интеграции. Это самый простой способ запустить встроенный веб-интерфейс.
  • Общее состояние. Поскольку вкладки используют файлы cookie браузера по умолчанию, пользователям не нужно повторно входить в аккаунт на сайтах, которые они уже посещали.
  • Вход через сторонний сервис. Вкладки хорошо подходят для входа через сторонний сервис (например, "Войти с аккаунтом Google" или "Войти через Facebook"), поскольку браузер безопасно обрабатывает учетные данные.

Хотя большинство браузеров поддерживают пользовательские вкладки, некоторые предлагают больше возможностей настройки, чем другие. Подробнее о поддержке браузеров…

Как использовать веб-контент в Jetpack Compose

При создании приложения с помощью Jetpack Compose можно использовать как пользовательские вкладки, так и WebView.

  • Пользовательские вкладки. Поскольку в них используется Intent, вы можете запускать их из любого Context в функциях Compose, что обеспечивает бесшовную интеграцию.
  • WebView. В Compose пока нет нативной composable-функции WebView, поэтому для встраивания стандартного компонента WebView в макет нужно использовать AndroidView.

Дополнительные ресурсы

Чтобы разрабатывать веб-страницы для устройств Android с помощью WebView или Custom Tabs API, ознакомьтесь со следующими документами: