태그매니저(GTM, google tag manager) 데이터 영역 변수 버전1과 버전2의 차이

구글 태그매니저를 사용할때 자주쓰는 변수의 종류가 데이터 영역 변수 입니다

 

 

기본적으로 데이터 영역변수는 아래와 같이 dataLayer에 데이터를 푸시할때 푸시되는 데이터를 의미합니다

dataLayer.push({
 'event': 'Pageview',
 'pagePath': 'https://www.googleanalytics.dev/pancakes',
 'pageTitle': 'Pancake Event Signup',
 'visitorType': 'customer'
});

 

위의 예제에서 event, pagePath, pageTitle, visitorType 이런것들이 모두 데이터 영역 변수 입니다

 

데이터 영역변수는 string, number, nested object, array 모두 사용이 가능합니다

 

dataLayer.push({
  'event': 'custom-event',
  'user': {
    name: "유저명"
  },
  'products': [
    {
      name: "상품명"
    }
  ]
});

 

이런식으로도 충분히 사용가능합니다

 

그런데 데이터 영역 변수를 만들때는 버전을 선택할수 있게되어있는데요

 

기본값으로는 버전2가 선택되어있고,

 

선택가능한 값은 버전1과 버전2가 있습니다

 

 

차이가 뭘까요?

 

버전1과 버전2의 차이점은 push된 object값을 머지하여 사용할것인가에 대한것인데요

 

기본값인 버전2는 푸시된 object 값을 머지하고

 

버전1은 머지하지 않습니다

 

 

글로 설명하면 이해가 어려우니 설명을 돕는 예제를 준비하였습니다

 

이벤트 회차	전송한 데이터	버전2 - 실제 해당 변수에 전송된 값	버전1 - 실제 해당 변수에 전송된 값
첫번째 이벤트	{   event: "click_button",   button_property: {     name: "버튼1",   } }	{   event: "click_button",   button_property: {     name: "버튼1"   } }	{   event: "click_button",   button_property: {     name: "버튼1"   } }
두번째 이벤트	{   event: "click_button",   button_property: {     name: "버튼2",     color: "red"   } }	{   event: "click_button",   button_property: {     name: "버튼2",     color: "red"   } }	{   event: "click_button",   button_property: {     name: "버튼2",     color: "red"   } }
세번째 이벤트	{   event: "click_button",   button_property: {     name: "버튼3",     category: "반지",   } }	{   event: "click_button1",   button_property: {     name: "버튼3",     category: "반지",     color: "red"   } }	{   event: "click_button1",   button_property: {     name: "버튼3",     category: "반지",   } }

 

 

 

이벤트를 3회 전송하는데 다른 값들을 전송하였습니다

 

첫번째 이벤트는 button_property에 name 속성만 전달하였구요

 

두번째 이벤트는 button_property에 name 속성에 다른 값을 전달하고 추가로 color 속성을 전달하였습니다

 

세번째 이벤트는 button_property에 name 속성에 다른 값을 전달하고 추가로 color 속성은 전달하지 않고 category 속성을 전달하였습니다

 

 

가장 중요하게 볼것은 세번째 이벤트의 버전1, 버전2의 각각 다른 결과입니다

 

버전2의 경우 앞선 이벤트에서 전달된 값과 머지를 통해 세번째 이벤트에는 전송하지 않은 color, category 속성을 함께 전달합니다

 

버전1의 경우는 앞선 이벤트에 전달된 값과 상관없이 세번째 이벤트에서만 전송한 category 속성만 전달합니다

 

그리고 버전1, 버전2 모두 같은 이름을 가진 속성을 가장 마지막 값으로 덮어쓰기 합니다

 

 

이런 차이점이 있기때문에 구분하여 사용하시는 것이 좋겠습니다

 

이같은 버전2 버전의 성격이 있기때문에 다음과 같은 데이터 전송에 주의해야합니다

 

// 첫번째 이벤트 전송
{
  myEvent: {
    view_detail: {
      ..
    }
  }
}

// 두번째 이벤트 전송
{
  myEvent: {
    begin_checkout: {
      ..
    }
  }
}

// 세번째 이벤트 전송
{
  myEvent: {
    purchase: {
      ..
    }
  }
}

 

 

각각 서로 다른 데이터를 담아 이벤트를 호출한것처럼 인식할수 있습니다

 

하지만 버전2의 데이터영역변수라면 실제로 전달된 결과는 머지된 결과인 다음과 같습니다

 

// 첫번째 이벤트 전송
{
  myEvent: {
    view_detail: {
      ..
    }
  }
}

// 두번째 이벤트 전송
{
  myEvent: {
    view_detail: {
      ..
    }
    begin_checkout: {
      ..
    }
  }
}

// 세번째 이벤트 전송
{
  myEvent: {
    view_detail: {
      ..
    }
    begin_checkout: {
      ..
    }
    purchase: {
      ..
    }
  }
}

 

 

값이 계속 이전값과 머지 값이 변수값으로 한번더 반복해서 전달됩니다

 

 

그렇다면 전자상거래 데이터 전송을 선택하는 경우에는 어떻게될까요?

 

 

이부분이 조금 명확하지 않아 저도 시험을 해보았는데요

 

전자상거래데이터의 경우 버전1과 같이 동작을 합니다

 

 

 

구글 공식 홈에서는 다음과 같이 안내가 되고 있습니다

dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
dataLayer.push({
  event: "view_item",
  ecommerce: {
    currency: "USD",
    value: 30.03,
    items: [
    {
      item_id: "SKU_12345",
      item_name: "Stan and Friends Tee",
      affiliation: "Google Merchandise Store",
      coupon: "SUMMER_FUN",
      discount: 2.22,
      index: 0,
      item_brand: "Google",
      item_category: "Apparel",
      item_category2: "Adult",
      item_category3: "Shirts",
      item_category4: "Crew",
      item_category5: "Short sleeve",
      item_list_id: "related_products",
      item_list_name: "Related Products",
      item_variant: "green",
      location_id: "ChIJIQBpAG2ahYAR_6128GcTUEo",
      price: 10.01,
      quantity: 3
    }
    ]
  }
});

 

 

구글 공식문서에서는 중복된 이커머스가 서로 영향을 주는것을 방지하기 위해서 

 

dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.

 

 

null을 사전에 전송하는 이 방식을 추천하고 있네요

 

하지만 실제로 문제가 없도록 버전1처럼 동작을 하는것으로 보입니다