Я пытался разобраться в этом вопросе довольно долго.Я создаю сценарий VPAID для поддержки основных функций VPAID в соответствии со спецификацией.
Для отображения рекламы я беру слот, предоставленный в параметрах initAd, и добавляю iFrame с моим видеоплеером внутри (PlayerJS) для показа рекламы (обязательно использовать собственный плеер для отслеживания событий сторонних производителей и т. Д.),Все работает хорошо, если слот не скрыт отображаемым свойством CSS или если его контейнер не скрыт.Когда он скрыт, браузер не позволяет iframe dom отображаться с помощью js, и поэтому проигрыватель не запускается.
initAd(width, height, viewMode, desiredBitrate, creativeData, environmentVars) {
this._attributes.width = width
this._attributes.height = height
this._attributes.viewMode = viewMode
this._attributes.desiredBitrate = desiredBitrate
this._slot = environmentVars.slot || this.this.emit('AdError', 'Slot is invalid')
this._slotWnd = function(a) {
a = a.ownerDocument
return a.defaultView || a.parentWindow
}(this._slot)
this._videoSlot = environmentVars.videoSlot || this.this.emit('AdError', 'Video slot is invalid')
try {
this.adParameters = JSON.parse(creativeData.AdParameters)
} catch (e) {
console.error('Error parsing AdParameters')
console.log(e)
}
this._slotWnd.addEventListener('message', (event) => { this.eventHandler(event, this) })
this._player = new PlayerFrameIniter(this._slot, this._slotWnd, false, true)
this._player.init( () => this.emit('AdLoaded') )
}
А в PlayerFrameIniter я создаю iframe, подобный этому:
createIframe(container, url, onFrameLoaded) {
this._frame = this._context.document.createElement('iframe')
const style = {
width: '100%',
height: '100%',
border: 0,
position: 'absolute',
overflow: 'hidden'
}
Object.assign(this._frame.style, style)
this._frame.src = url
this._frame.onload = onFrameLoaded
container.appendChild(this._frame)
}
Как правильно настроить рендеринг фрейма внутри слота или, может быть, есть другой подход к этой задаче?