Вступление
Как упоминалось в нашем Предыдущий пост HLS Interstitials не работает в сафари или в любом другом игроке HTML5, но это не значит, что это не может Работа.
” Интерстициальное воспроизведение на устройствах Apple осуществляется с использованием двух игроков »(gettstartedwithhlsinterstitials.pdf, p.3)
Это общая техника, используемая в May Avod Services сегодня, хотя и без рекламы, являющейся частью Манифеста HLS, Клиент создает два <Видео/> элементы и помещают их друг на друга и просто переключаться между помощью которого <Видео/> элемент виден.
Это означает, что единственное, что мы ограничиваемся, – это наша способность читать интерстициальные HLS от проявления.
В этом посте мы сосредоточимся на том, как добиться этого в Safari и в будущем посте мы покажем, как выполнить это, используя превосходную библиотеку hls.sjs.
Чтение манифеста
Поскольку Interstitials HLS добавляются с использованием существующих Ext-X-DARENGE Тег Мы можем использовать встроенные API в браузере для их прочтения. В сафари они достиг этого, используя TextTrack интерфейс
// listen to the `addtrack` event to detect when a texttrack is added to the video element
video.textTracks.addEventListener('addtrack', ({ track }: TrackEvent) => {
// check if the track is of kind "metadata", this is where Safari adds any EXT-X-DATERANGE information
if (track && track.kind === "metadata") {
// by default the track is disabled, set it to "hidden" to allow it to start parsing any EXT-X-DATERANGE
track.mode = "hidden";
// track.cues will now be populated with all available EXT-X-DATERANGES in the entire manifest!
track.addEventListener("cuechange", async (evt) => {
// if this event is dispatched the `track.activeCues` property will contain the active EXT-X-DATERANGE
});
}
});
Ext-X-Dateranges появится в Cues/Activeceues Поле текстовой дорожки метаданных как Datacue. Спецификация этих сигналов только в проекте, поэтому они могут быть изменены. Соответствующая часть для интерстициальных HLS является следующая
{
value:
{
key: "X-ASSET-LIST",
data: ""
},
startTime: 55,
...
}
Обратите внимание, что каждый ИКС- * Атрибут DARECENGE появится в виде отдельных сигналов, поэтому, если вы хотите полностью поддержать интерстициальные HLS, вам необходимо прочитать из нескольких сигналов, чтобы получить полную интерстициальную конфигурацию HLS.
Используя эту технику, мы смогли создать Это Простой демонстрация POC Show-Counding Как HLS Interstitials может выглядеть сегодня в Safari. Демонстрация содержит PRROLL и две средние милашки, один на 20 и один при 1 м 40.
Учащиеся
При внедрении этого маленького POC мы обнаружили две конкретные вещи, которые нужно обдумать, чтобы получить это на работу.
Трек метаданных становится отключенным.
Когда интерстициальное видео воспроизведение, главное видео отключит метаданные трек, что означает, что мы больше не можем читать Ext-X-Dateranges от проявления. К счастью, браузер отправляет событие «OnChange» на текстураках, чтобы мы могли включить его, если это необходимо.
Safari читает PDT 0 как false
Если вы установите PDT HLS на # Ext-X-Program-Date-Time: 1970-01-01T00: 00: 00.000z Safari не будет установить Запуск Поле Ext-X-Daterge Cue правильно, он установит все Запуск поля для 0 Отказ Простой обходной путь, если вы управляете HLS, это установить его на 1, например. # Ext-X-Program Date-Time: 1970-01-01T00: 00: 00.001z
О Технологии Eevinn
Технология Eyevinn является независимой консультантной фирмой, специализирующейся на видео и потоковых. Независимо от того, что мы не коммерчески привязаны к любой платформе или поставщику технологии.
В Eyevinn каждый консультант разработчика программного обеспечения имеет выделенный бюджет, зарезервированный для разработки и вклада открытого источника в Сообщество с открытым исходным кодом. Это дает нам место для инноваций, сборной и личной компетентной разработки. А также дает нам как компания способ внести свой вклад в сообщество с открытым исходным кодом.
Хотите узнать больше о Eevinn и как это здесь работать. Свяжитесь с нами на works@eyevinn.se!
Оригинал: “https://dev.to/video/hls-interstitials-on-safari-go7”