analytics.js에서 gtag.js로 이전하기(유니버설 애널리틱스)

이 가이드에서는 기존 analytics.js 유니버설 애널리틱스 구현을 gtag.js를 사용하도록 이전하는 과정을 안내합니다.

개요

analytics.js에는 데이터를 Google 애널리틱스로 전송하기 위한 두 가지 주요 메커니즘이 있습니다.

추적기

추적기는 측정 중인 속성을 지정합니다.
조회 유형

조회 유형은 측정 중인 상호작용의 유형을 지정합니다.

gtag.js에서 속성은 config 명령어를 통해 또는 명령어의 매개변수로 지정됩니다.

analytics.js와 달리 gtag.js는 추적기를 사용하여 데이터를 Google 애널리틱스로 전송하지 않습니다. config 명령어로 설정한 ID로 표시되는 Google 애널리틱스 속성으로 데이터를 전송합니다. gtag.js에 제공된 이벤트 이름이 Google 애널리틱스로 전송되는 데이터 유형을 지정합니다.

analytics.js에서 gtag.js로 이전하려면 사이트의 모든 웹페이지에 대해 다음 작업을 실행하세요.

analytics.js 스니펫을 gtag.js 스니펫으로 대체합니다.
analytics.js 코드를 동등한 gtag.js 코드로 대체하여 다음 작업을 실행합니다.

analytics.js 스니펫을 gtag.js 스니펫으로 대체

웹페이지의 analytics.js 스니펫을

<!-- 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','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'GA_MEASUREMENT_ID', 'auto');
  ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

다음 gtag.js 스니펫으로 대체합니다.

<!-- Global Site Tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_MEASUREMENT_ID');
</script>

페이지 조회 측정

analytics.js는 추적기를 사용하여 페이지 조회를 Google 애널리틱스로 전송합니다. 추적기에는 Google 애널리틱스 속성의 측정 ID가 있습니다. gtag.js는 config 명령어에 지정된 GA_MEASUREMENT_ID로 표시되는 Google 애널리틱스 속성으로 페이지 조회를 전송합니다.

기본 추적기로 페이지 조회 측정

기본 추적기를 사용하여 Google 애널리틱스로 페이지 조회를 send하는 다음 analytics.js 코드를 삭제합니다.

// Creates the default tracker.
ga('create', 'GA_MEASUREMENT_ID', 'auto');

// Uses the default tracker to send a pageview to the
// Google Analytics property with tracking ID GA_MEASUREMENT_ID.
ga('send', 'pageview');

gtag.js 전역 스니펫의 다음 코드는 추적 ID가 GA_MEASUREMENT_ID인 Google 애널리틱스 속성으로 페이지 조회를 자동 전송합니다.

gtag('config', 'GA_MEASUREMENT_ID');

지정된 추적기로 페이지 조회 측정

지정된 추적기를 사용하여 Google 애널리틱스로 페이지 조회를 전송하는 다음 analytics.js 코드를

ga('create', 'GA_MEASUREMENT_ID', 'auto', 'trackerName');
ga('trackerName.send', 'pageview');

다음 gtag.js event 명령어로 대체합니다.

gtag('event', 'page_view', { 'send_to': 'GA_MEASUREMENT_ID' });

이벤트 측정

앞서 언급했듯이 analytics.js는 추적기를 사용하여 이벤트를 Google 애널리틱스로 전송합니다. 추적기에는 Google 애널리틱스 속성의 추적 ID가 있습니다. 반면 gtag.js는 config 명령어에 지정된 GA_MEASUREMENT_ID로 표시되는 Google 애널리틱스 속성으로 이벤트를 전송합니다.

기본 추적기로 이벤트 측정

기본 추적기를 사용하여 Google 애널리틱스로 이벤트를 send하는 다음 analytics.js 코드를

ga('create', 'GA_MEASUREMENT_ID', 'auto');
ga('send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);

다음 gtag.js event 명령어로 대체합니다.

gtag('event', eventName, eventParameters);

여기서 eventName은 로깅할 이벤트의 이름입니다.

예:

analytics.js:

// Creates the default tracker.
ga('create', 'GA_MEASUREMENT_ID', 'auto');

// Uses the default tracker to send the event to the
// Google Analytics property with tracking ID GA_MEASUREMENT_ID.
ga('send', 'event', 'Videos', 'play', 'Fall Campaign');

gtag.js:

// Sends the event to the Google Analytics property with
// tracking ID GA_MEASUREMENT_ID set by the config command in
// the global tracking snippet.
gtag('event', 'play', {
  'event_category': 'Videos',
  'event_label': 'Fall Campaign'
});

지정된 추적기로 이벤트 측정

지정된 추적기를 사용하여 Google 애널리틱스로 이벤트를 전송하는 다음 analytics.js 코드를

ga('create', 'GA_MEASUREMENT_ID', 'auto', 'trackerName');
ga('trackerName.send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);

다음 gtag.js event 명령어로 대체합니다.

gtag('event', eventName, {
  'send_to': 'GA_MEASUREMENT_ID',
  'parameter1': 'value1',
  'parameter2': 'value2',
  // ...
});

예:

analytics.js:

// Creates a tracker named <b>clientTracker</b>.
ga('create', 'GA_MEASUREMENT_ID', 'auto', 'clientTracker');

// Uses tracker clientTracker to send the event to the
// Google Analytics property with tracking ID GA_MEASUREMENT_ID.
ga('clientTracker.send', 'event', 'Videos', 'play', 'Fall Campaign');

gtag.js:

// Send the event to the Google Analytics property
// with tracking ID GA_MEASUREMENT_ID.
gtag('event', 'play', {
  'send_to': 'GA_MEASUREMENT_ID',
  'event_category': 'Videos',
  'event_label': 'Fall Campaign'
});

맞춤 측정기준 및 측정항목 전송

웹페이지에서 Google 애널리틱스로 맞춤 측정기준을 전송하는 모든 analytics.js send 명령어를

ga('send', 'hitType', { 'dimension&lt;Index&gt;':  'dimension_value'});

다음 gtag.js 코드로 대체합니다.

gtag('config', 'GA_MEASUREMENT_ID', {
  'custom_map': {'dimension<Index>': 'dimension_name'}
});
gtag('event', 'any_event_name', {'dimension_name': 'dimension_value'});

GA_MEASUREMENT_ID를 자체 애널리틱스 ID로 대체합니다.

웹페이지에서 Google 애널리틱스로 맞춤 측정항목을 전송하는 모든 analytics.js send 명령어를

ga('send', 'hitType', { 'metric<Index>':  'metric_value'});

다음 gtag.js 코드로 대체합니다.

gtag('config', 'GA_MEASUREMENT_ID', {
  'custom_map': {'metric<Index>': 'metric_name'}
});
gtag('event', 'any_event_name', {'metric_name': 'metric_value'});

GA_MEASUREMENT_ID를 자체 애널리틱스 ID로 대체합니다.

사용자 시간 측정

웹페이지에서 사용자 시간을 추적하는 모든 analytics.js send 명령어를

ga('send', 'timing', 'timingCategory', 'timingVar', timingValue, 'timingLabel');

다음 gtag.js event 명령어로 대체합니다.

gtag('event', 'timing_complete', {
  'name': 'timingVar',
  'value': timingValue,
  'event_category': 'timingCategory',
  'event_label': 'timingLabel'
});

예외 측정

웹페이지에서 예외를 추적하는 모든 analytics.js send 명령어를

ga('send', 'exception', {
  'exDescription': 'error_message',
  'exFatal': false  // set to true if the exception is fatal
});

다음 gtag.js event 명령어로 대체합니다.

gtag('event', 'exception', {
  'description': 'error_message',
  'fatal': false  // set to true if the exception is fatal
});

analytics.js 필드를 gtag.js 매개변수에 매핑

다음 표에서는 analytics.js 필드를 해당하는 gtag.js 매개변수에 매핑합니다.

이벤트

analytics.js 필드	gtag.js 매개변수
`eventAction`	`event_action`
`eventCategory`	`event_category`
`eventLabel`	`event_label`
`eventValue`	`value`

맞춤 측정기준 및 측정항목

analytics.js 필드	gtag.js 매개변수
`dimension<Index>`	`dimension<Index>`
`metric<Index>`	`metric<Index>`

여기서 <Index>는 맞춤 측정기준 또는 측정항목의 색인을 나타내는 음수가 아닌 정수입니다.

사용자 시간

analytics.js 필드	gtag.js 매개변수
`timingCategory`	`event_category`
`timingLabel`	`event_label`
`timingValue`	`value`
`timingVar`	`name`

예외 측정

analytics.js 필드	gtag.js 매개변수
`exDescription`	`description`
`exFatal`	`fatal`

향상된 전자상거래 액션 데이터

analytics.js 필드	gtag.js 매개변수
`id`	`transaction_id`
`affiliation`	`affiliation`
`revenue`	`value`
`tax`	`tax`
`shipping`	`shipping`
`coupon`	`coupon`
`list`	`list_name`
`step`	`checkout_step`
`option`	`checkout_option`

프로모션 데이터

analytics.js 필드	gtag.js 매개변수
`creative`	`creative_name`
`position`(노출, 제품)	`list_position`
`position`(프로모션)	`creative_slot`

제품 및 프로모션 액션

analytics.js 필드	gtag.js 이벤트
`add`	`add_to_cart`
`checkout`(1단계)	`begin_checkout`
`checkout`(모든 후속 단계)	`checkout_progress`
`checkout_option`	`set_checkout_option`
`click`	`select_content`(프로모션 제외)
`detail`	`view_item`
`promo_click`	`select_content`(프로모션 포함)
`purchase`	`purchase`
`refund`	`refund`
`remove`	`remove_from_cart`

클라이언트 ID 및 사용자 ID

analytics.js 필드	gtag.js 매개변수
`clientId`	`client_id`
`userId`	`user_id`