JavaScript в Android Studio: способы запуска и интеграции

Разработчик, открывший Android Studio и попытавшийся добавить .js-файл в проект, быстро обнаруживает: среда не предлагает запустить JavaScript напрямую, потому что нативный код Android-приложений пишется на Kotlin или Java. Однако выполнить JavaScript внутри приложения вполне реально — через WebView, встроенные движки вроде QuickJS или V8, а также через гибридные фреймворки.

В этой статье разберём рабочие способы интеграции JavaScript в проект Android Studio: от простого выполнения скрипта в WebView до двустороннего моста между JS и нативным кодом. Вы узнаете, какой подход выбрать под свою задачу, какие подводные камни встречаются чаще всего и как отлаживать скрипты без лишних инструментов.

Почему Android Studio не запускает JavaScript напрямую

Android-приложения компилируются в байт-код для виртуальной машины ART (Android Runtime), которая понимает только Kotlin и Java. JavaScript — интерпретируемый язык, и для его выполнения нужен отдельный движок. Именно поэтому файл script.js, добавленный в проект, останется просто ресурсом: система не станет его исполнять.

Хорошая новость в том, что движок JavaScript уже встроен в каждое Android-устройство — он находится внутри компонента WebView, который основан на Chromium. Кроме того, существуют сторонние библиотеки, встраивающие полноценные движки (QuickJS, Rhino, Node.js Mobile) прямо в приложение без браузерного окружения.

Выбор способа зависит от задачи: отобразить веб-страницу, выполнить вычисления на JS без интерфейса или построить гибридное приложение с UI на HTML/CSS.

Способ 1: выполнение JavaScript через WebView

Самый доступный метод — компонент WebView. Он есть в стандартном SDK, не требует сторонних зависимостей и поддерживает современный синтаксис JS, поскольку использует движок Chromium. По умолчанию выполнение скриптов в WebView отключено, его нужно включить явно.

val webView = findViewById<WebView>(R.id.webview)
webView.settings.javaScriptEnabled = true
webView.evaluateJavascript("2 + 2") { result ->
Log.d("JS", "Результат: $result") // "4"
}

Метод evaluateJavascript() выполняет произвольный код и возвращает результат в колбэк в виде строки. Это удобно для вычислений, парсинга данных или вызова функций уже загруженной страницы. Альтернатива — загрузить локальный HTML-файл из папки assets через loadUrl("file:///android_asset/page.html").

⚠️ Внимание: включение javaScriptEnabled вместе с загрузкой контента из недоверенных источников открывает путь для XSS-атак. Никогда не выполняйте скрипты, полученные из пользовательского ввода или незащищённых соединений.

• 🔧 Включите JavaScript только для тех WebView, где он действительно нужен
• 📦 Храните HTML/JS-файлы локально в assets, если нет необходимости в сети
• 🧹 Используйте evaluateJavascript() вместо устаревшей схемы loadUrl("javascript:...")
• 🔒 Ограничьте навигацию через WebViewClient.shouldOverrideUrlLoading()

Способ 2: мост между JavaScript и нативным кодом

Если скрипту нужно вызывать функции Android — например, показать Toast, получить данные GPS или сохранить файл — используется аннотация @JavascriptInterface. Она создаёт объект, видимый из JS-окружения WebView.

class JsBridge(private val context: Context) {
@JavascriptInterface
fun showToast(message: String) {
Toast.makeText(context, message, Toast.LENGTH_SHORT).show()
}
}
webView.addJavascriptInterface(JsBridge(this), "Android")

После этого из JavaScript можно вызвать Android.showToast("Привет"). Обратный вызов — из нативного кода в JS — выполняется через тот же evaluateJavascript(). Такой двусторонний канал лежит в основе большинства гибридных приложений.

⚠️ Внимание: на старых версиях Android (ниже 4.2) интерфейс addJavascriptInterface содержал уязвимость, позволявшую выполнять произвольный код. На современных версиях методы без аннотации @JavascriptInterface недоступны из JS, но публиковать в мост следует только действительно необходимые функции.

Способ 3: движки JavaScript без WebView

Когда нужно выполнять скрипты в фоне — без отображения страницы — WebView избыточен: он тяжёлый, требует UI-потока и зависит от версии системного компонента. В таких случаях подключают standalone-движки через Gradle-зависимости.

Популярные варианты: QuickJS (компактный движок с поддержкой современного стандарта), Rhino (движок Mozilla на Java, работает без нативных библиотек), V8 через обёртки вроде J2V8 и Node.js Mobile для полноценной серверной среды внутри приложения. У каждого решения свои требования к версии Android и размеру сборки — проверяйте актуальную документацию конкретной библиотеки перед интеграцией.

Способ 4: гибридные фреймворки

Третий путь — вообще не смешивать языки вручную, а взять фреймворк, где интерфейс пишется на HTML/CSS/JS, а нативная часть генерируется автоматически. Apache Cordova и Capacitor упаковывают веб-приложение в Android-проект, который затем открывается и собирается в Android Studio как обычный проект.

Отдельно стоит React Native: там JavaScript управляет нативными компонентами через собственный мост, а собранный модуль также интегрируется в проект Android Studio. Этот вариант подходит, когда приложение целиком пишется на JS, а Android Studio нужна для сборки, подписи APK и добавления нативных модулей.

Пошаговая настройка WebView-проекта

Ниже — безопасная последовательность для базового сценария «локальная HTML-страница со скриптом внутри приложения». Шаги не зависят от конкретной модели устройства, но расположение пунктов меню может немного отличаться между версиями Android Studio.

Папка assets создаётся через контекстное меню модуля: New → Folder → Assets Folder. Путь к файлу внутри неё всегда начинается с префикса file:///android_asset/. Если страница не грузится, первым делом проверьте регистр имён файлов — на устройстве файловая система чувствительна к регистру, в отличие от Windows.

Результат проверяется просто: добавьте в HTML кнопку, вызывающую JS-функцию, и убедитесь, что она срабатывает. Если скрипт не выполняется, откройте логи через Logcat — ошибки WebView обычно попадают туда с понятным описанием.

Частые причины, почему скрипт не работает

Забыли включить javaScriptEnabled — самая частая причина. Вторая — неверный путь к файлу в assets (проверьте регистр букв и расширение). Третья — синтаксическая ошибка в самом JS: WebView молча игнорирует упавший скрипт, поэтому включите отладку через chrome://inspect, чтобы увидеть консоль.

Отладка JavaScript внутри приложения

Главный инструмент отладки — Chrome DevTools. При подключённом устройстве или запущенном эмуляторе откройте в десктопном Chrome страницу chrome://inspect: там появится список WebView вашего приложения с кнопкой inspect. Доступны консоль, точки останова, просмотр DOM и сетевых запросов — по сути, полноценная отладка веб-страницы.

Чтобы WebView был виден в инспекторе на release-сборках, требуется явный вызов WebView.setWebContentsDebuggingEnabled(true); в debug-сборках отладка обычно доступна по умолчанию. Для standalone-движков без WebView DevTools недоступны — там приходится обходиться логированием результатов через Log.d() или перехватом исключений движка.

⚠️ Внимание: не оставляйте setWebContentsDebuggingEnabled(true) в релизной сборке, публикуемой в магазине, — это позволит любому подключённому ПК читать содержимое WebView, включая пользовательские данные.

Часто задаваемые вопросы

Можно ли писать Android-приложение полностью на JavaScript в Android Studio?

Напрямую — нет: Android Studio компилирует только Kotlin и Java. Но можно использовать фреймворки вроде React Native, Capacitor или Cordova, где логика пишется на JS, а Android Studio используется для сборки и подписи итогового APK.

Почему evaluateJavascript возвращает null?

Метод возвращает результат последнего выражения в виде строки. Если скрипт ничего не возвращает, завершился с ошибкой или вызван до загрузки страницы, результатом будет null. Убедитесь, что страница загружена (дождитесь onPageFinished()), и проверьте синтаксис скрипта.

Что быстрее: WebView или отдельный движок вроде QuickJS?

Для чистых вычислений standalone-движок обычно предпочтительнее: WebView тратит ресурсы на рендеринг и требует главного потока. Но если скрипт взаимодействует с DOM-страницей, WebView — единственный вариант.

Работает ли современный синтаксис (async/await, модули) в WebView?

WebView на актуальных устройствах основан на Chromium и обновляется через Google Play, поэтому поддерживает современные возможности языка. Однако на старых устройствах версия движка может отставать — проверяйте поддержку конкретных конструкций на целевых версиях Android.

Безопасно ли включать javaScriptEnabled?

Сам по себе флаг безопасен, если WebView загружает только доверенный локальный контент. Риск возникает при загрузке внешних страниц по HTTP или выполнении скриптов из недоверенных данных — в таких сценариях возможны XSS-атаки и утечка данных через JS-мост.