При разработке интерфейсов в 1С иногда возникает необходимость встроить медиаплеер прямо в форму справочника или документа. Допустим, мы сохранили аудиофайл в реквизите с типом ХранилищеЗначения и хотим воспроизвести его с помощью тега <audio> в поле HTML-документа. Если мы просто попытаемся подставить навигационную ссылку 1С или жестко заданный локальный путь в атрибут src, плеер работать не будет. Давайте разберем эту проблему и рассмотрим несколько рабочих способов ее решения.
В исходном примере разработчик пытался получить адрес файла через ПолучитьНавигационнуюСсылку() и склеить его с путем к общему каталогу платформы. Однако встроенный браузер (движок WebKit или устаревший IE, в зависимости от версии платформы) не умеет напрямую обрабатывать внутренние навигационные ссылки 1С формата e1c:// внутри HTML-тегов. Кроме того, жесткое указание пути вида C:\Program Files\... нарушает принципы клиент-серверной архитектуры и безопасности браузеров, особенно если база будет открыта через веб-клиент.
Проанализируем два основных и наиболее правильных подхода к решению этой задачи: использование временных файлов и кодирование в Base64.
Этот способ подойдет для тонкого или толстого клиента. Суть заключается в том, чтобы перед формированием HTML-текста извлечь данные из хранилища и сохранить их во временный файл на диске пользователя. Затем мы передаем реальный локальный путь к этому файлу в наш макет.
Рассмотрим по шагам, как это реализовать в коде:
ДвоичныеДанные аудиофайла из реквизита объекта.ПолучитьИмяВременногоФайла().Посмотрим на пример реализации в модуле формы:
&НаСервере
Процедура ПодготовитьПлеерНаСервере()
Если Объект.Ссылка.Пустая() Тогда
Возврат;
КонецЕсли;
// Получаем макет HTML
АудиоПлеер = Справочники.КарточкаКомпозиции.ПолучитьМакет("HtmlПлеер").ПолучитьТекст();
// Получаем двоичные данные из хранилища
ДвоичныеДанные = Объект.ФайлХЗ.Получить();
Если ДвоичныеДанные <> Неопределено Тогда
// Генерируем уникальный путь во временном каталоге
ПутьКВременномуФайлу = ПолучитьИмяВременногоФайла("mp3");
// Сохраняем файл на диск
ДвоичныеДанные.Записать(ПутьКВременномуФайлу);
// Заменяем маркер в макете на реальный путь
АудиоПлеер = СтрЗаменить(АудиоПлеер, "|||ПутьКФайлу|||", ПутьКВременномуФайлу);
КонецЕсли;
КонецПроцедуры
Важно: При использовании этого метода на диске клиента будут скапливаться временные файлы. Рекомендуется удалять их при закрытии формы, используя процедуру УдалитьФайлы().
Разберем более современный и элегантный подход, который отлично работает как в тонком, так и в веб-клиенте. Мы вообще не будем сохранять файл на жесткий диск. Вместо этого мы преобразуем двоичные данные аудиофайла в текстовую строку формата Base64 и передадим ее прямо внутрь тега <audio>.
Формат Data URI выглядит следующим образом: data:[<mediatype>][;base64],<data>. Для MP3-файла это будет data:audio/mpeg;base64,ТУТ_СТРОКА....
Рассмотрим нюанс 1С: встроенная функция Base64Строка() добавляет символы переноса строк, которые ломают HTML-код. Их обязательно нужно вырезать перед вставкой в макет.
Посмотрим на пример кода с использованием Base64:
&НаСервере
Процедура ПодготовитьПлеерЧерезBase64()
Если Объект.Ссылка.Пустая() Тогда
Возврат;
КонецЕсли;
АудиоПлеер = Справочники.КарточкаКомпозиции.ПолучитьМакет("HtmlПлеер").ПолучитьТекст();
ДвоичныеДанные = Объект.ФайлХЗ.Получить();
Если ДвоичныеДанные <> Неопределено Тогда
// Конвертируем данные в строку Base64
СтрокаBase64 = Base64Строка(ДвоичныеДанные);
// Очищаем строку от переносов, которые добавляет 1С
СтрокаBase64 = СтрЗаменить(СтрокаBase64, Символы.ПС, "");
СтрокаBase64 = СтрЗаменить(СтрокаBase64, Символы.ВК, "");
// Формируем формат Data URI
DataURI = "data:audio/mpeg;base64," + СтрокаBase64;
// Подставляем в макет
АудиоПлеер = СтрЗаменить(АудиоПлеер, "|||ПутьКФайлу|||", DataURI);
КонецЕсли;
КонецПроцедуры
Преимущества метода Base64:
C:\... из-за политик безопасности).При работе с полем HTML-документа всегда обращайте внимание на режим совместимости вашей конфигурации. В старых версиях платформы 1С для рендеринга использовался движок Internet Explorer, который мог не поддерживать тег <audio> (приходилось использовать устаревшие теги вроде <bgsound>). В современных версиях 1С (при отключенном режиме совместимости или использовании WebKit) стандартный HTML5-тег <audio> работает без нареканий.