javascript - 动态添加Google Analytics

Question

我需要先获得我网站的用户的同意，然后我才能使用 Google Analytics(分析)。因此我必须动态添加脚本。但我似乎无法让它发挥作用。

我尝试了这个问题的方法: Dynamically add script tag with src that may include document.write

这确实添加了脚本标记，但 Analytics 不会触发事件和综合浏览量。

如果我将此代码段添加到我的 index.html 中，一切都会正常工作。

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-MYGOOGLEID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
</script>

有什么想法吗？

这就是我尝试添加它的方式。

const s = document.createElement('script');
s.setAttribute('src', 'https://www.googletagmanager.com/gtag/js?id=UA-MYGOOGLEID');
s.async = true;
document.head.appendChild(s);

window.dataLayer = window.dataLayer || [];
window.gtag = () => {dataLayer.push(arguments);}

window.gtag('js', new Date());
window.gtag('config', 'UA-MYGOOGLEID');

Answer 1

胖箭头函数中不存在参数。

解决方案是将其保留为 ES5 函数。

window.gtag = function() {
  window.dataLayer.push(arguments);
};

测试

function gtagtest() {console.log(arguments)}
  gtagtest('event', 'testEvent', {
   'event_category': 'testClick'
  })
Arguments(3) ["event", "testEvent", {…}, callee: ƒ, Symbol(Symbol.iterator): ƒ]

const gtagtest2 = (...args) =>  {console.log(args)}
gtagtest2('event', 'testEvent', {
  'event_category': 'testClick'
})
(3) ["event", "testEvent", {…}]

const gtagtest3 = () =>  {console.log(arguments)}
gtagtest3('event', 'testEvent', {
  'event_category': 'testClick'
})
Uncaught ReferenceError: arguments is not defined
at gtagtest3 (<anonymous>:1:39)
at <anonymous>:1:1