仅在存在广告素材时加载视频播放器答案

【问题标题】：Load videoplayer only when creative exist仅在存在广告素材时加载视频播放器
【发布时间】：2021-02-19 00:40:05
【问题描述】：

我在 Google AdManager 中为视频创建了一个广告单元。手册在这里：https://support.google.com/admanager/answer/1181016?hl=en。我在我的 Radiant Player 中使用了生成的 AdTagUrl（我想将它用于包含在文章中的视频广告）。手册在这里：https://www.radiantmediaplayer.com/docs/latest/outstream-video-ads.html。它工作正常。但仅当 AdManager 发送广告素材时。当 AdManager 未发送任何广告素材时，我必须隐藏播放器。

有没有办法检测 AdManager 是否在加载播放器之前发送了广告？

例如：

function showOutstreamVideo()
{
    //detect if there is an advertisement
    var x = new XMLHttpRequest();
    x.open("GET", AdTagUrl, true);
    x.onreadystatechange = function () {
    if (x.readyState == 4 && x.status == 200)
    {
        var vast = x.responseXML;
        if(vast.getElementsByTagName("Ad").length>0)
        {   //code for read, init and place player
        }
  }
}

...但是我不能用这个巨大的物体来启动 Radiant Player。当我再次使用 adTagUrl 时，对于 AdManager 来说，这将是第二印象，这可能会有所不同。是否有解决方案可以防止页面在没有广告素材时不必要地请求播放器脚本？

感谢和抱歉我的英语

【问题讨论】：

标签： media-player google-ad-manager video-ads

【解决方案1】：

您是否尝试过动态加载 Radiant Player？

var settings = {};
var vast = x.responseXML;
if(vast.getElementsByTagName("Ad").length>0) {
    var player = document.createElement('script');
    player.src = "https://cdn.radiantmediatechs.com/rmp/5.10.6/js/rmp.min.js";
    document.body.appendChild(player);
    var elementID = 'rmpPlayer';
    var rmp = new RadiantMP(elementID);
    rmp.init(settings);
}

【讨论】：

是的，我动态加载播放器，但是如何让播放器拾取已经加载的巨大对象（文档）而不是第二次请求 adTagUrl？
我正在使用 JW Player 而不是 Radiant Player。可以直接通过 API 加载 VAST XML（而不是广告代码 URL）。可能Radiant Player没有这个功能。

【解决方案2】：

AdResponse：巨大，（作为字符串）是播放器设置的正确选择。

    var x = new XMLHttpRequest();
    x.open("GET", outstreamAdTagUrl, true);
    x.onreadystatechange = function ()
    {   if (x.readyState == 4 && x.status == 200)
        {   vast = x.responseText; //x.responeXML;
            //if(vast.getElementsByTagName("Ad").length>0)
            if(vast.length > 200) //it should be sufficient to determine if it is an ad or an empty VAST
            {   //read and init player
                var player = document.createElement('script');
                document.body.appendChild(player);
                player.onload = function(){runOutstream(vast);};
                player.setAttribute('src', 'https://cdn.radiantmediatechs.com/rmp/5.10.6/js/rmp.min.js');
            }
        }
    };
    x.send(null);

    function runOutstream(vast)
    {
    var settings = {
        ... license key etc...
        autoplay: true,
        adOutStreamMutedAutoplay: true,
        ads: true,
        //adsResponse: new XMLSerializer().serializeToString(vast), //when using responseXML()
        adsResponse: vast,
        adOutStream: true,
        skin: 'outstream',
        ...other setting
    };

    var rmp = new RadiantMP('rmpPlayer');
    rmp.init(settings);
    }

【讨论】：