Question

我有一个页面可以在加载时触发ajax调用

$(window).load(function() {
  updateDeliverySlots();
});

我的正文顶部还有Google跟踪代码管理器javascript（我知道目前的建议是将其置于 head 部分，但我们还没有尚未更新代码，并且不认为这是问题的根源。）

<body>
        <!-- Google Tag Manager -->
<noscript>
    <iframe src="//www.googletagmanager.com/ns.html?id=XXXX" height="0" width="0" style="display:none;visibility:hidden">
    </iframe>
</noscript>
<script>
    (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});
    var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';
    j.async=true;
j.src='//www.googletagmanager.com/gtm.jsid='+i+dl;f.parentNode.insertBefore(j,f);
})
(window,document,'script','dataLayer','XXXX');
</script>
<!-- End Google Tag Manager -->
....
</body>

我对GTM标记中包含的脚本进行的调用之一有疑问。该脚本向第三方发送请求。如果请求因任何原因无法连接（例如服务器关闭），则在请求超时（60秒）之前，我的updateDeliverySlots（）函数（以及其中的ajax调用）不会被触发。我还发现页面仍在“加载”（根据浏览器图标）。

我的GTM实施中有什么东西我做错了吗？我的理解是，谷歌标签背面的所有内容都应该是异步的，并且与页面的“准备就绪”无关。

Answer 1

同步脚本必须必须处理并在处理到达时运行，async scripts 可能在处理完毕后随时运行。

根据服务器/页面控件之外的时间，异步脚本因此可以：

在文档完成之前添加同步资源，其时间延迟加载事件
在处理页面后添加同步资源，不会影响加载事件。
添加一个不会对页面产生重大影响的异步资源（除非它反过来向页面添加同步资源）

您可以选择以下几个选项之一来解决这个问题：

修复自定义脚本以使用异步资源
将触发触发器更改为page view -> window loaded
将脚本替换为谷歌提供的标签（如果可用），因为它们应构建为仅使用异步资源
在GTM中阻止自定义脚本（这也会阻止相关跟踪）
将GTM代码段上的异步更改为defer。

即：

  <!-- Google Tag Manager -->
  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
  new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
  j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.defer=true;j.src=
  'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
  })(window,document,'script','dataLayer','GTM-XXXXX');</script>
  <!-- End Google Tag Manager -->

由于这会将整个GTM流程移至页面完全解析后，因此会破坏“Google Optimizer”标记和早期页面跟踪。

Answer 2

我有同样的问题，GTM确实推迟了其他脚本的执行。使用jquery $（window）.load加载它的一个小改动解决了这个问题：

<script>function loadgtm(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
};$(window).load(function(){loadgtm(window,document,'script','dataLayer','GTMID');});</script>

Google跟踪代码管理器延迟window.load？

2 个答案: