4

我目前是一个使用pushstate进行页面转换的网站的开发人员。

该网站使用Google DFP 广告,在每个页面转换/路线上刷新

我注意到Internet Explorer中存在问题

我在Windows 7, IE10上。

googletag.pubads().refresh(GOOGLE_ADS);

将删除 window.history 堆栈上的条目,从而导致使用后退按钮的条目不正确。

快速示例

将条目添加到历史堆栈

console.log(window.history.length) // 3

window.history.pushState({}, 'title', '/page_1');
window.history.pushState({}, 'title', '/page_2');
window.history.pushState({}, 'title', '/page_3');
window.history.pushState({}, 'title', '/page_4');

console.log(window.history.length) // 7

刷新广告

googletag.pubads().refresh(GOOGLE_ADS);

再次检查历史长度

console.log(window.history.length) // 3

如果我按下后退按钮,它将转到登录页面之前的页面。

其他人在 IE 中注意到这个问题吗?查看 DFP 源代码,它引用了 window.history 几次。

4

4 回答 4

2

我有完全相同的问题,即使在具有不同域的 iframe 中运行广告仍然会导致历史记录丢失。我相信这与 IE 将 iframe src 更改作为历史事件处理有关,但基本上使用谷歌广告完全破坏了 IE 中的 pushstate。我发现解决的唯一方法是不使用谷歌广告。

于 2013-06-04T13:27:34.357 回答
2

我们遇到了完全相同的问题。在 IE10 和 IE11 中,如果您使用的是 DFP,则 pushstate 几乎没用。

但是,我们确实想出了一个解决方案。它不漂亮,但它有效。

我们插入一个 iframe,而不是加载广告。在该 iframe 中,广告照常加载。但是,不能在该 iframe 中使用 refresh() 方法,仍然会出现同样的问题。但是当广告加载到 iframe 中时,您可以做的是刷新整个 iframe。通过这样做,广告将被刷新,并且 pushstate 功能将保持不变。

相当讨厌,但它的工作原理。由于几个原因在 iframe 中加载广告不好,我们只在 IE10 和 IE11 中这样做。

于 2014-11-05T15:57:34.060 回答
1

我在使用 IE10 和 IE11 时遇到了同样的问题——非常令人失望。

对于它的价值,我向微软提出了一个错误,可以在这里看到:

https://connect.microsoft.com/IE/feedbackdetail/view/979564/ie-pushstate-history-is-corrupted-by-google-adsense-google-dpf-doubleclick-for-publishers-advertising

如果您有时间,请添加您对错误的关注,以使其更加重视有希望的修复。

亚当

于 2014-09-23T05:23:56.640 回答
0

正如我在 DFP 帮助论坛上发布的那样:https ://productforums.google.com/forum/#!topic/dfp/9BsgVtKTU9A

我有工作解决方案,我在其中使用 jQuery。

if(typeof googletag !== 'undefined' && typeof googletag.pubads !== 'undefined') {
   if(adsCloned === false) {
      var $dfpIframe = $('#div-gpt-ad-1477269112222-0').find('iframe'); // this is ad id that you use in googletag.defineSlot()

      $dfpIframe.each(function (i, v) {
         var $clone = $(v).clone();
         $(v).replaceWith($clone);
      });
      adsCloned = true;
   }
   googletag.pubads().refresh();
}

在此之前,您必须定义var adsCloned = false; 它起作用的原因是,当您刷新页面加载后插入的 iframe(在本例中为克隆 iframe)时,历史记录条目不会添加到 IE。

编辑:如果它对您不起作用,请尝试删除 if statememt:

if(typeof googletag !== 'undefined' && typeof googletag.pubads !== 'undefined') {
       var $dfpIframe = $('#div-gpt-ad-1477269112222-0').find('iframe'); // this is ad id that you use in googletag.defineSlot()

       $dfpIframe.each(function (i, v) {
          var $clone = $(v).clone();
          $(v).replaceWith($clone);
       });
       googletag.pubads().refresh();
    }

上面的代码不起作用 - 我的错误。但对我来说可行的解决方案是销毁整个 googletag 变量并再次调用整个代码。

dfp 脚本的第一次调用如下所示(注意 googletag.pubads().disableInitialLoad(); 和 gads.id = 'dfpHeadScript';):

// Doubleclick
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
    var gads = document.createElement('script');
    gads.async = true;
    gads.id = 'dfpHeadScript';
    gads.type = 'text/javascript';
    var useSSL = 'https:' == document.location.protocol;
    gads.src = (useSSL ? 'https:' : 'http:') +
        '//www.googletagservices.com/tag/js/gpt.js';
    var node = document.getElementsByTagName('script')[0];
    node.parentNode.insertBefore(gads, node);
})();

googletag.cmd.push(function() {
    enovatis.dfpSlots.push( googletag.defineSlot('...', [240, 400], 'div-gpt-ad-1').addService(googletag.pubads()) );
    enovatis.dfpSlots.push( googletag.defineSlot('...', [[960, 100], [750, 100]], 'div-gpt-ad-2').addService(googletag.pubads()) );

    googletag.pubads().enableSingleRequest();
    googletag.pubads().collapseEmptyDivs();
    googletag.pubads().disableInitialLoad();
    googletag.enableServices();
});

googletag.cmd.push(function(){
    googletag.pubads().refresh();
});

刷新广告的方法是:

var dfpInterval = null;
var $dfpTop = $('#div-gpt-ad-1');
var $dfpLeft = $('#div-gpt-ad-2');

function refreshDfp() {

    $dfpTop.empty();
    $dfpLeft.empty();

    googletag =  {};
    googletag.cmd = [];

    $('#dfpHeadScript').remove();

    (function() {
        var gads = document.createElement('script');
        gads.async = true;
        gads.id = 'dfpHeadScript';
        gads.type = 'text/javascript';
        var useSSL = 'https:' == document.location.protocol;
        gads.src = (useSSL ? 'https:' : 'http:') +
            '//www.googletagservices.com/tag/js/gpt.js';
        var node = document.getElementsByTagName('script')[0];
        node.parentNode.insertBefore(gads, node);
    })();

    googletag.cmd.push(function() {
        enovatis.dfpSlots.push( googletag.defineSlot('...', [240, 400], 'div-gpt-ad-1').addService(googletag.pubads()) );
        enovatis.dfpSlots.push( googletag.defineSlot('...', [[960, 100], [750, 100]], 'div-gpt-ad-2').addService(googletag.pubads()) );
        googletag.pubads().enableSingleRequest();
        googletag.pubads().collapseEmptyDivs();
        googletag.pubads().disableInitialLoad();
        googletag.enableServices();

        window.clearInterval(dfpInterval);
        dfpInterval = window.setInterval(function(){
            if(typeof googletag.pubads !== 'undefined'){
                window.setTimeout(function(){
                    googletag.pubads().refresh();
                }, 75);
                window.clearInterval(dfpInterval);
            }
        }, 75);
    });
}

我称之为:refreshDfp.apply(window);一切正常。这种方法的唯一缺点是我们每次都向 google 发送更多请求。

于 2015-09-29T07:05:59.630 回答