ga 객체 이름 바꾸기

페이지에 analytics.js를 추가하고 싶지만 ga 변수가 이미 다른 용도로 사용되고 있는 경우가 있습니다. 이 문제를 해결하기 위해 analytics.js는 전역 ga 객체의 이름을 바꾸는 메커니즘을 제공합니다.

전역 객체 이름 바꾸기

Google 애널리틱스 태그를 사용하면 축소된 함수에 전달된 최종 매개변수를 변경하여 전역 ga 객체의 이름을 바꿀 수 있습니다. 또한 명령어 큐의 모든 호출을 ga()에서 선택한 이름으로 업데이트해야 합니다.

예를 들어 ga 객체의 이름을 analytics로 변경하려면 다음과 같이 태그를 변경하면 됩니다.

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','analytics');

analytics('create', 'UA-XXXXX-Y', 'auto');
analytics('send', 'pageview');
</script>
<!-- End Google Analytics -->

수동으로 전역 객체 이름 바꾸기

전역 객체의 이름을 바꿀 수 있는 것은 analytics.js가 로드될 때 GoogleAnalyticsObject라는 전역 변수에 저장된 문자열을 찾기 때문입니다. 해당 변수를 찾으면 문자열 이름을 전역 명령어 큐의 새 이름으로 사용합니다.

예를 들어 jQuery의 $.getScript 메서드를 사용하여 analytics.js를 로드하는 경우 다음 코드를 사용하여 전역 객체의 이름을 바꿀 수 있습니다.

<script>
// Instructs analytics.js to use the name `analytics`.
window.GoogleAnalyticsObject = 'analytics';

// Use jQuery to load analytics.js.
$.getScript('//www.google-analytics.com/analytics.js', function() {

  // Creates a tracker and sends a pageview using the renamed command queue.
  analytics('create', 'UA-12345-1', 'auto');
  analytics('send', 'pageview');
});
</script>

대체 비동기 태그

표준 Google 애널리틱스 태그와 달리 대체 비동기 태그는 전역 ga 객체 이름 바꾸기를 기본적으로 지원하지 않습니다.

하지만 위에서 설명한 기법을 사용하면 전역 ga 객체의 이름을 바꾸더라도 미리 로드된 대체 비동기 태그의 모든 이점을 계속 누릴 수 있습니다.

다음 대체 비동기 태그의 수정된 버전은 GoogleAnalyticsObject 변수를 analytics로 설정하고 ga의 모든 인스턴스 이름도 analytics로 바꿉니다.

<!-- Google Analytics -->
<script>

// Instructs analytics.js to use the name `analytics`.
window.GoogleAnalyticsObject = 'analytics';

// Creates an initial analytics() function.
// The queued commands will be executed once analytics.js loads.
window.analytics = window.analytics || function() {
  (analytics.q = analytics.q || []).push(arguments)
};

// Sets the time (as an integer) this tag was executed.
// Used for timing hits.
analytics.l = +new Date;

// Creates a default analytics object with automatic cookie domain configuration.
analytics('create', 'UA-12345-1', 'auto');

// Sends a pageview hit from the analytics object just created.
analytics('send', 'pageview');
</script>

<!-- Sets the `async` attribute to load the script asynchronously. -->
<script async src='//www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->