javascript - 离线时如何避免google-analytics-loading延迟加载事件侦听器

Question

我有一个可以在线和离线工作的应用程序。我已将 GA 包含在 async on 的正文中。我还有处理与load事件侦听器相关的 DOM 的核心函数window。系统未连接时，ga.js文件需要很长时间才能尝试加载。这可以防止load事件触发。那么我该如何避免这种情况呢？我可以使用DOMContentLoaded，但那是一样的，因为 js 文件包含在 DOM 内容中。

Answer 1

试试这个。

1. 我们允许 ga 正常加载。
2. 我们将 ga dom 元素的引用存储在全局变量 (gaClone) 中。

3. 我们将超时设置为 30 秒。我们还设置了另一个全局变量（loadedGoogleAnalytics）并最初将其设置为 0。当 ga 加载时，我们将此变量设置为 1。在超时到期时，我们检查 ga 是否已加载。如果不是，我们删除 dom 元素 ga。

   <script type="text/javascript">
       var loadedGoogleAnalytics = 0;
       var gaClone;
       var _gaq = _gaq || [];
       _gaq.push(['_setAccount', 'UA-123456789-1']);
       _gaq.push(['_trackPageview']);
   
       _gaq.push(function() {
           loadedGoogleAnalytics = 1;
           //console.log('GA Actualy executed!');
       });
   
       (function() {
           var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
           ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
           var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
   
           gaClone = ga;
   
       })();
   
       setTimeout(function() {
           //console.log('timeout fired');
           if (loadedGoogleAnalytics != 1) {
               gaClone.parentNode.removeChild(gaClone); 
           }
       }, 30000);
   </script>