Бесплатно HTML в У вас есть сайт, и вы хотите, чтобы он был у людей на телефонах в виде приложения. Поищите, как это сделать, и вы снова и снова будете встречать три термина: PWA, TWA и WebView. Они звучат похоже, все показывают веб-страницы, и их часто плохо объясняют.
На самом деле они сильно различаются, и правильный выбор избавит вас от множества переделок. Вот что представляет собой каждый вариант, что он умеет и чего не умеет и когда он имеет смысл.
Вариант 1: прогрессивное веб-приложение (PWA)
PWA — это сайт, который ведёт себя больше как приложение. У него есть манифест веб-приложения (небольшой JSON-файл с названием, значком и цветами) и обычно service worker — скрипт, который может кешировать файлы, чтобы сайт загружался и без подключения к сети. Когда человек открывает PWA в браузере с поддержкой этой технологии, он может установить его на главный экран. После этого PWA открывается в отдельном окне без адресной строки.
Преимущества: не нужно собирать отдельное приложение. Вы обновляете сайт, и у всех пользователей сразу новая версия. С service worker сайт может работать офлайн.
Ограничения: людям сначала нужно найти ваш сайт, а затем нажать «Установить», и многие этого так и не делают. Обычный PWA — это не файл, который можно загрузить в Google Play, и не APK, который можно кому-то передать. Доступ к функциям телефона зависит от того, что браузер предоставляет через веб-API.
Подходит для: сайтов, которые люди и так часто посещают, где установка — приятный бонус, а не главная цель.
Вариант 2: Trusted Web Activity (TWA)
Trusted Web Activity — это небольшое Android-приложение, которое открывает ваш PWA на весь экран в браузере пользователя, например в Chrome. Оно построено на протоколе Custom Tabs, поэтому страницу отрисовывает сам браузер, а не приложение.
Есть два требования. Во-первых, нужно доказать, что сайт и приложение принадлежат одному владельцу. Для этого используется Digital Asset Links: вы размещаете на своём домене файл /.well-known/assetlinks.json с именем пакета приложения и отпечатком сертификата подписи. Во-вторых, в документации Google сказано, что сайт должен соответствовать критериям добавления на главный экран, то есть на практике быть полноценным PWA с манифестом. Инструмент Google для сборки TWA — Bubblewrap, утилита командной строки для Node.js.
Если проверка не проходит или браузер не поддерживает TWA, то, по словам Google, вместо полноэкранного режима открывается Custom Tab с простой панелью браузера. Это самый частый сюрприз, с которым сталкиваются люди.
Преимущества: вы получаете настоящее Android-приложение, которое можно разместить в Google Play, а контент — это ваш живой PWA, так что изменения на сайте появляются сразу.
Ограничения: нужен работающий PWA и контроль над доменом, чтобы разместить файл asset links. Отпечаток в этом файле должен совпадать с ключом, которым подписано приложение, которое пользователи фактически устанавливают, а при Play App Signing копия из Google Play подписана ключом подписи приложения Google, поэтому Google советует указать отпечатки и этого ключа, и вашего ключа загрузки. Функции телефона по-прежнему ограничены тем, что браузер предоставляет через веб-API. Кроме того, приложение зависит от того, установлен ли браузер с поддержкой TWA.
Подходит для: команд, у которых уже есть надёжный PWA на собственном домене и которые хотят разместить его в Play Store с минимумом дополнительного кода.
Вариант 3: WebView-приложение
WebView-приложение — это нативное Android-приложение, которое показывает веб-контент в своём окне с помощью компонента Android WebView. WebView — это браузерный движок без самого браузера вокруг: нет адресной строки, нет вкладок, только ваша страница. В документации Google он описан как вариант для показа собственного веб-контента, когда нужна гибкость в интерфейсе.
Главное отличие от TWA — контроль. Приложение само решает, что происходит при нажатии кнопки «Назад», как выглядит экран заставки, есть ли нативные меню, что показывать при отсутствии сети и какие ссылки открываются внутри приложения. Android также позволяет WebView-приложению связать JavaScript с нативным кодом через addJavascriptInterface, чтобы ваша страница могла вызывать настоящие функции телефона, недоступные в вебе. В документации Google есть важное предупреждение: открывайте этот мост только для HTML и JavaScript, которые вы написали сами.
Преимущества: работает с любым сайтом или папкой HTML-файлов, без PWA, манифеста или файла asset links. Страницы можно встроить в приложение, чтобы они мгновенно открывались офлайн. Нативные функции доступны через мост.
Ограничения: у приложения своё хранилище, поэтому вход пользователя на ваш сайт в Chrome не переносится в приложение. Если вы оборачиваете живой сайт, именно вы отвечаете за обновление приложения, когда нужно изменить что-то нативное.
Подходит для: HTML-приложений, игр, инструментов, сайтов малого бизнеса, внутренних корпоративных приложений и всего, что выигрывает от нативных дополнений.
Сравнение
Функции телефона
- PWA: всё, что поддерживает браузер через веб-API.
- TWA: то же самое, поскольку страницу отрисовывает браузер.
- WebView-приложение: веб-API плюс всё, что приложение открывает через JavaScript-мост.
Офлайн
- PWA и TWA: офлайн работает, если ваш service worker кеширует всё необходимое.
- WebView-приложение: встроенные страницы работают офлайн без service worker; приложения-сайты могут показывать свой офлайн-экран.
Google Play
- PWA: сам по себе нет. Его нужно упаковать, обычно в виде TWA.
- TWA и WebView-приложение: оба — обычные Android-приложения и могут быть опубликованы как AAB.
Одно правило Play одинаково касается TWA и WebView-приложений. Политика Google Play в отношении спама не допускает приложения, основная цель которых — показывать сайт в WebView без разрешения его владельца. Оборачивайте свой сайт или тот, на который у вас есть разрешение. Play также не допускает приложения с очень ограниченной функциональностью, поэтому дайте людям повод установить приложение, а не просто добавить закладку.
Какой выбрать?
- Вам нужна только кнопка установки на сайте: PWA.
- У вас зрелый PWA на собственном домене, и вы хотите разместить его в Play с живым веб-контентом: TWA.
- Вам нужны нативные функции, офлайн-HTML, меню и полный контроль, или у вас нет PWA: WebView-приложение.
Как это делает Free HTML to APK
Free HTML to APK собирает WebView-приложения. Можно начать с URL сайта, HTML-файлов, ZIP или папки и получить подписанный APK, а также AAB для Google Play. Конструктор на сайте freehtmltoapk.com бесплатный, не требует аккаунта и не добавляет водяной знак, а Android-приложение «HTML to APK: Website to App» делает то же самое на вашем телефоне.
Ваши страницы могут использовать встроенный JavaScript-мост FreeApp для функций телефона, таких как вибрация, уведомления, камера, сканирование QR- и штрихкодов, геолокация и отправка файлов. Вызов выглядит так просто:
<button onclick="FreeApp.vibrate(30)">Tap</button>
Встроенные HTML-приложения полностью работают офлайн, а приложения-сайты показывают понятную офлайн-страницу и снова подключаются, когда связь восстанавливается. Поскольку это WebView-приложение, файл Digital Asset Links настраивать не нужно. Если у вас уже есть PWA, его service worker продолжает работать, когда приложение загружает его по URL.
Подробнее читайте на страницах PWA в APK и сайт в приложение и выберите путь, который подходит вашему проекту.