При разработке современных интерфейсов на платформе 1С:Предприятие, особенно когда речь идет о мобильном клиенте, разработчики часто прибегают к использованию поля HTML-документа. Это позволяет создавать гибкие и красивые интерфейсы, такие как чаты, дашборды или кастомные формы ввода. Однако при попытке реализовать стандартную загрузку файлов через HTML-тег input type="file" многие сталкиваются с тем, что кнопка выбора файла просто не реагирует на нажатие. В этой статье мы разберем, почему это происходит, и проанализируем, как правильно организовать работу с файлами в мобильной среде.
Для начала проанализируем ситуацию с точки зрения архитектуры мобильной платформы. Поле HTML-документа в мобильном клиенте использует встроенные системные компоненты: WebView для ОС Android и WKWebView для iOS. Несмотря на то, что это полноценные браузерные движки, они работают внутри защищенного контейнера приложения 1С.
Когда в обычном браузере нажимается кнопка выбора файла, операционная система получает запрос на открытие диалогового окна. В случае с мобильным клиентом 1С, разработчики платформы сознательно ограничивают проброс этих событий (например, обработчик onShowFileChooser в Android) из соображений безопасности и контроля над файловой системой. Более того, политика безопасности Apple в отношении WKWebView запрещает доступ веб-контента к локальным ресурсам устройства без явного посредничества основного приложения. Поэтому попытка использовать «чистый» HTML для работы с файловой системой в мобильном клиенте всегда будет приводить к отсутствию реакции интерфейса.
Рассмотрим основной способ решения задачи — использование механизма JS-Bridge. Суть метода заключается в том, что мы не пытаемся заставить HTML работать самостоятельно, а делегируем задачу выбора файла встроенному языку 1С. Разберем этот процесс по шагам.
Шаг 1. Подготовка HTML-кода
Вместо стандартного тега выбора файла мы создадим обычную кнопку или ссылку, которая будет инициировать событие в JavaScript. Для передачи управления в 1С можно использовать схему навигации или метод оповещения.
Рассмотрим пример функции JavaScript, которая будет вызываться при нажатии на кнопку «Прикрепить файл»:
function selectFile() {
// Вариант 1: Использование специальной ссылки, которую перехватит 1С
window.location.href = "v8action://selectFile";
// Вариант 2: Использование штатного метода оповещения (если поддерживается контекстом)
// window.external.notification("selectFileRequested");
}
Шаг 2. Перехват события на стороне 1С
Теперь проанализируем, как обработать это нажатие в управляемой форме 1С. Для этого нам понадобится событие ПриНажатии (или ПриИзменении в зависимости от метода) поля HTML-документа.
&НаКлиенте
Процедура ПолеHTMLДокументаПриНажатии(Элемент, ДанныеСобытия, СтандартнаяОбработка)
// Проверяем, что нажата именно наша ссылка
Если Найти(ДанныеСобытия.Href, "v8action://selectFile") > 0 Тогда
СтандартнаяОбработка = Ложь; // Отменяем переход по ссылке в браузере
ВыполнитьВыборФайла(); // Вызываем штатный диалог 1С
КонецЕсли;
КонецПроцедуры
Разберем подробнее, как должна работать процедура ВыполнитьВыборФайла(). Поскольку мы находимся в мобильном клиенте, нам важно использовать асинхронные методы и учитывать особенности мобильной ОС.
Для выбора изображений или видео наиболее эффективно использовать объект СредстваМультимедиа, так как он предоставляет прямой доступ к камере и галерее:
&НаКлиенте
Процедура ВыполнитьВыборФайла()
// Проверяем поддержку мультимедиа на устройстве
Если СредстваМультимедиа.ПоддерживаетсяВыборИзображений() Тогда
ОписаниеОповещения = Новый ОписаниеОповещения("ПослеВыбораФайла", ЭтотОбъект);
СредстваМультимедиа.НачатьВыборИзображения(ОписаниеОповещения);
Иначе
// Если это не изображение, используем стандартный диалог выбора файла
ПараметрыДиалога = Новый ПараметрыДиалогаПомещенияФайлов;
НачатьПомещениеФайлаНаСервер(,,, ПараметрыДиалога, УникальныйИдентификатор);
КонецЕсли;
КонецПроцедуры
После того как файл выбран средствами 1С и помещен во временное хранилище, нам нужно отобразить его в нашем HTML-чате или форме. Здесь кроется важный нюанс: передача «тяжелых» данных.
Проанализируем проблему памяти: если мы попытаемся конвертировать файл (например, фото 10 Мб) в строку Base64 и передать её обратно в HTML через выполнение скрипта, мобильное приложение может аварийно завершиться из-за нехватки оперативной памяти. Это особенно актуально для iOS.
Рекомендуемый алгоритм действий:
НачатьПомещениеФайлаНаСервер.ДвоичныеДанные файла.img src="ссылка".Пример возврата данных в HTML через вызов функции JS:
&НаКлиенте
Процедура ПослеВыбораФайла(Результат, ДополнительныеПараметры) Экспорт
Если Результат = Неопределено Тогда
Возврат;
КонецЕсли;
// Получаем адрес временного хранилища
АдресФайла = Результат.Адрес;
// Формируем вызов функции JS, которая добавит картинку в интерфейс
ТекстСкрипта = "addMessageWithImage('" + АдресФайла + "');";
Элементы.ПолеHTMLДокумента.Документ.parentWindow.eval(ТекстСкрипта);
КонецПроцедуры
Важно помнить, что даже самый правильный код не сработает, если у приложения нет прав на доступ к ресурсам устройства. При сборке мобильного клиента в Сборщике мобильных приложений необходимо обязательно проверить наличие следующих разрешений (галочек):
Без этих разрешений методы СредстваМультимедиа и диалоги выбора файлов будут возвращать пустой результат или вызывать системную ошибку доступа.
Мы рассмотрели, почему стандартные HTML-механизмы загрузки файлов не работают в мобильном клиенте 1С, и проанализировали эффективный путь обхода этого ограничения. Использование взаимодействия через v8action или window.external.notification позволяет сохранить гибкость веб-интерфейса, используя при этом надежность и безопасность нативных методов платформы 1С:Предприятие 8.3. Такой подход гарантирует стабильную работу приложения на обеих популярных мобильных операционных системах — Android и iOS. Практический пример реализации подобного веб-интерфейса можно изучить в конфигурации мобильного учёта на базе HTML-поля.