我们怎样才能阻止OpenX阻止页面加载？

Question

我们怎样才能阻止OpenX阻止页面加载？

pjm*_*rse 9 javascript performance client-side openx page-load-time

我们使用OpenX在多个网站上投放广告.但是,如果OpenX服务器出现问题,它会阻止这些站点上的页面加载.我宁愿让网站优雅地失败,即加载没有广告的网页,并在网站可用时填写.

我们正在使用OpenX的单页调用,我们在CSS中给div显式大小,这样它们可以在没有内容的情况下布局,但仍然加载脚本块页面加载.是否有其他使用OpenX加速页面的最佳实践？

Answer 1

lee*_*tts 5

我们在iframe中加载广告,以避免您遇到的问题.我们将div和iframe的大小相同,iframe指向一个只包含广告代码段的页面(您可以将区域和其他必需的选项作为参数传递给该页面).

干杯

背风处

Answer 2

Raf*_*afa 5

我们懒惰加载OpenX的代码.我们将其放在底部,而不是将单页调用放在页面顶部.页面加载后,调用将获取横幅数据,自定义代码将在正确的区域中添加正确的横幅.

下面的代码需要一个合适的DOM.如果您有jQuery,DOMAssistant,FlowJS等,那么应该为您修复DOM.此代码适用于包含图像,Flash或HTML内容的普通横幅.在某些情况下,例如使用来自外部提供商(adform等)的横幅时,它可能无效.为此,您可能需要稍微破解代码.

如何使用它？

在HTML代码的末尾添加SinglePageCall代码
在SPC代码下添加此代码.
大约半秒后,您的OpenX代码应该准备就绪,下面的代码会将横幅放在指定的DIV中.
哦,是的,您需要在HTML代码中添加一些DIV作为横幅的占位符.默认情况下,我将这些横幅设置为CSS类"隐藏",它完全隐藏了DIV(具有可见性,显示和高度).然后,在成功加载给定DIV中的横幅之后,我们删除隐藏的类,并且DIV(以及其中的横幅)变得可见.

使用风险自负!:) 希望能帮助到你

(function(){
if (!document || !document.getElementById || !document.addEventListener || !document.removeClass) {
return; // No proper DOM; give up.
}
var openx_timeout = 1, // limit the time we wait for openx
oZones = new Object(), // list of [div_id] => zoneID
displayBannerAds; // function.


// oZones.<divID> = <zoneID>
// eg: oZones.banner_below_job2 = 100;
// (generated on the server side with PHP)
oZones.banner_top = 23;
oZones.banner_bottom = 34;



displayBannerAds = function(){
if( typeof(OA_output)!='undefined' && OA_output.constructor == Array ){
  // OpenX SinglePageCall ready!

  if (OA_output.length>0) {

    for (var zone_div_id in oZones){
      zoneid = oZones[zone_div_id];

      if(typeof(OA_output[zoneid])!='undefined' && OA_output[zoneid]!='') {

        var flashCode,
          oDIV = document.getElementById( zone_div_id );

        if (oDIV) {

          // if it's a flash banner..
          if(OA_output[zoneid].indexOf("ox_swf.write")!=-1)
          {

            // extract javascript code
            var pre_code_wrap = "<script type='text/javascript'><!--// <![CDATA[",
              post_code_wrap = "// ]]> -->";

            flashCode = OA_output[zoneid].substr(OA_output[zoneid].indexOf(pre_code_wrap)+pre_code_wrap.length);
            flashCode = flashCode.substr(0, flashCode.indexOf(post_code_wrap));


            // replace destination for the SWFObject
            flashCode = flashCode.replace(/ox\_swf\.write\(\'(.*)'\)/, "ox_swf.write('"+ oDIV.id +"')");


            // insert SWFObject
            if( flashCode.indexOf("ox_swf.write")!=-1 ){
              eval(flashCode);
              oDIV.removeClass('hidden');
            }// else: the code was not as expected; don't show it


          }else{
            // normal image banner; just set the contents of the DIV
            oDIV.innerHTML = OA_output[zoneid];
            oDIV.removeClass('hidden');
          }
        }
      }
    } // end of loop
  }//else: no banners on this page
}else{
  // not ready, let's wait a bit
  if (openx_timeout>80) {
    return; // we waited too long; abort
  };
  setTimeout( displayBannerAds, 10*openx_timeout );
   openx_timeout+=4;
}
};
displayBannerAds();
})();

Run Code Online (Sandbox Code Playgroud)

Answer 3

Kev*_*vin 1

OpenX 有一些关于如何异步加载标签的文档： http://docs.openx.com/ad_server/adtagguide_synchjs_implementing_async.html

我已经测试过了，它在当前的 Chrome/Firefox 中运行良好。

需要对其广告代码进行一些手动调整。他们的广告代码应如何结束的示例：

<html>
<head></head>

<body>

Some content here.

Ad goes here.

<!-- Preserve space while the rest of the page loads. -->

<div id="placeholderId" style="width:728px;height:90px">

<!-- Fallback mechanism to use if unable to load the script tag. -->

<noscript>
<iframe id="4cb4e94bd5bb6" name="4cb4e94bd5bb6"
 src="http://d.example.com/w/1.0/afr?auid=8&target=
_blank&cb=INSERT_RANDOM_NUMBER_HERE"
 frameborder="0" scrolling="no" width="728"
 height="90">
<a href="http://d.example.com/w/1.0/rc?cs=
4cb4e94bd5bb6&cb=INSERT_RANDOM_NUMBER_HERE"
 target="_blank">
<img src="http://d.example.com/w/1.0/ai?auid=8&cs=
4cb4e94bd5bb6&cb=INSERT_RANDOM_NUMBER_HERE"
 border="0" alt=""></a></iframe>
</noscript>
</div>

<!--Async ad request with multiple parameters.-->

<script type="text/javascript">
    var OX_ads = OX_ads || [];
    OX_ads.push({
       "slot_id":"placeholderId",
       "auid":"8",
       "tid":"4",
       "tg":"_blank",
       "r":"http://redirect.clicks.to.here/landing.html",
       "rd":"120",
       "rm":"2",
       "imp_beacon":"HTML for client-side impression beacon",
       "fallback":"HTML for client-side fallback"
    });
</script>

<!-- Fetch the Tag Library -->

<script type="text/javascript" src="http://d.example.com/w/1.0/jstag"></script>

Some other content here.

</body>
</html>

Run Code Online (Sandbox Code Playgroud)

归档时间：	15 年，2 月前
查看次数：	7329 次
最近记录：	11 年，6 月前