서버 측 Google 태그 관리자(GTM)용 전환 API

전환 API는 마케팅 데이터와 시스템 간에 직접 연결을 만들어서 효과적으로 광고 타게팅을 최적화하고, 행동당 비용을 낮추고, 모든 Meta 테크놀로지의 결과를 측정할 수 있게 설계되었습니다. 전환 API를 통해 주요 웹 및 오프라인 이벤트 데이터를 전송하도록 Google Cloud Platform(GCP) 또는 그 외의 다른 클라우드 제공업체에 설정한 서버를 구성할 수 있습니다. 이 설정을 사용하면 Google 애널리틱스 4(GA4) 웹 태그를 구성한 후, 해당 데이터를 GCP(Google Cloud Platform)에서 호스팅되는 자체 서버로 전송할 수 있으며, 최종적으로 전환 API를 통해 Meta로 전송할 수 있습니다.

전환 API 태그는 Google 맞춤 태그 템플릿에 기반하여 Meta에서 작성하고 관리합니다. Google 제품 설정이나 Google의 개발자 문서와 관련하여 궁금한 점이 있으시면 Google에 문의해 주세요.

이 문서에서는 다음과 같은 내용을 간략히 설명합니다.

  • 필수 조건(서버 컨테이너를 생성하는 방법 포함)
  • GA4 웹 태그의 구현을 지원하도록 컨테이너를 구성하는 방법
  • 웹사이트에서 GCP 서버로 데이터를 보내는 방법
  • 전환 API를 통해 해당 데이터를 Meta에 공유하는 방법
  • 자주 묻는 질문

필수 조건

이 통합을 진행하기 전에 다음과 같은 준비를 하는 것이 좋습니다.

  1. 전환 API 통합 및 설정 모범 사례를 숙지합니다.
  2. 서버 측 태깅맞춤 태그 템플릿을 숙지합니다.

시스템에서 GA4보다 오래된 버전을 사용할 경우 이 통합을 진행하기 전에 GA4를 사용하도록 기존 태그 관리자 설정을 업그레이드해야 합니다.

통합

GTM 서버 컨테이너 만들기

이 컨테이너를 만들면 추적 및 마케팅 태그를 관리하고 저장할 수 있습니다. 이는 사용자가 웹사이트와 상호 작용하는 방식을 추적하는 데도 도움이 됩니다.

서버 컨테이너와 웹 컨테이너를 구성해야 합니다.

  • 웹 컨테이너: GTM을 처음 사용하는 경우 먼저 웹 컨테이너를 계정에 설치합니다. 자세한 내용은 여기를 참조하세요.
  • 서버 컨테이너: GTM 포털에 서버 컨테이너를 만들고 태깅 서버 URL을 설정해야 합니다. 이 단계에 대해 자세히 알아보세요.

Google 태그 관리자 웹사이트를 방문하여 Google 태그 관리자로 이동합니다.

새 컨테이너 만들기

이미 계정이 있는 경우 해당 계정을 선택합니다. 그렇지 않을 경우 새 GTM 계정을 만듭니다.

  • 컨테이너 만들기를 클릭합니다.

  • 컨테이너의 이름을 지정하고 '서버'를 대상 플랫폼으로 선택합니다.

  • 만들기를 클릭합니다.

서버 컨테이너를 설정하려면 태깅 서버를 구성해야 합니다. 서버 컨테이너를 설정할 때 기본 GCP 배포를 완료할 수 있습니다. 다음 지침을 참조하세요. 다른 클라우드 공급자(예: AWS, Microsoft Azure)의 경우 수동 서버 설정 가이드를 참조하세요.

웹 및 서버 컨테이너 구성

  1. 웹 컨테이너에서 다음 아티팩트를 만듭니다.
    • 태깅 서버 URL을 구성하기 위한 GA4 구성
    • 이벤트 스키마를 서버로 전달하도록 구성하는 GA4 이벤트
  2. 서버 컨테이너에서 다음 아티팩트를 만듭니다.
    • GA4 클라이언트(이벤트를 Meta에 실행하는 이벤트에 대한 리스너)
    • Meta 전환 API 태그(GA4 클라이언트에서 전환 API 이벤트 스키마로 표준 이벤트를 변환하고 graph.facebook.com으로 보내는 서버 측 태그)

1단계: GA4 구성 – 태깅 서버 URL 구성

웹사이트 데이터를 생성된 태깅 서버로 전송하도록 웹 컨테이너를 구성합니다. Google 애널리틱스: GA4 구성 태그를 구성하는 방법에 대해 자세히 알아보세요.

  • 서버 컨테이너로 보내기를 선택할 경우 서버 컨테이너 URL을 태깅 서버 URL로 설정하세요.
  • 서버 컨테이너로 보내기를 선택하지 않는 경우 설정할 필드에서 행 추가를 클릭하고 다음을 설정하세요.
    • 필드 이름: transport_url
    • 필드 값: 태깅 서버 URL

모든 이벤트에 대해 전송하려는 다른 매개변수에 대해 추가 필드를 구성할 수 있습니다.

  • first_party_collection 플래그를 true로 설정합니다. 이는 user_data 매개변수를 서버 측 GTM으로 전달하려면 필수입니다. 설정할 필드에서 행 추가를 클릭하고 다음을 설정합니다.
    • 필드 이름: first_party_collection
    • 필드 값: true

기존 GA4 구성 태그 사용

기준 GA4 구성이 이미 설정된 경우 이를 수정하거나 서버 측 GTM에 대해 추가적인 구성 태그를 만들 수 있습니다.

처음으로 서버 측 GTM을 설정할 경우 서버 컨테이너 URL을 추가하면 모든 트래픽이 서버 컨테이너로 전송됩니다. GA4로 데이터를 계속 전송하려면 서버 컨테이너에서 GA4 서버 측 태그를 추가하여 모든 이벤트에서 이를 실행하도록 해야 합니다. 추가적인 GA4 이벤트 태그를 만들거나 기존 태그를 수정하여 Meta 픽셀 이벤트에 대한 완전한 매핑을 보장해야 할 수 있습니다.

Meta 브라우저 ID 및 Meta 클릭 ID 보내기

맞춤 도메인을 설정하였고 GTM 태깅 서버 도메인이 자사 소유일 경우, Meta 브라우저 ID와 Meta 클릭 ID가 자동으로 전송됩니다.

제공되는 기본 도메인을 사용 중이거나 이벤트 관리자에서 브라우저 ID 및 클릭 ID 필드가 전송되지 않는 것을 발견하는 경우, 이를 다음과 같이 구성할 수 있습니다.

  • 변수 섹션으로 이동하여 Meta 브라우저 ID 및 Meta 클릭 ID에 대해 새로운 사용자 정의 변수를 만듭니다. 퍼스트 파티 쿠키 변수 유형을 사용합니다.
    • Meta 브라우저 ID의 경우 쿠키 이름을 _fbp로 설정합니다.
    • Meta 클릭 ID의 경우 쿠키 이름을 _fbc로 설정합니다.
  • 이러한 변수를 저장합니다.
  • GA4 구성 태그의 설정할 필드에서 행 추가를 클릭하고 다음과 같이 설정합니다.
    • 필드 이름: x-fb-ck-fbp
    • 필드 값: Meta 브라우저 ID 변수
  • 클릭 ID에 대해 추가적인 행을 추가합니다.
  • 필드 이름: x-fb-ck-fbc
  • 필드 값: Meta 클릭 ID 변수

각 GTM 공통 이벤트 스키마의 user_data 매개변수에 대해 데이터 레이어 변수를 만듭니다. 데이터 레이어 변수 설정에 대해 자세히 알아보세요. 예를 들어 이메일 주소를 서버 측 GTM으로 전달하려면 데이터 레이어 변수 이름 eventModel.user_data.email_address에 매핑할 수 있는 변수(예: user_data_email_address)를 만듭니다.

데이터 레이어를 사용하지 않는 경우 각 매개변수에 대한 변수를 아래에 표시된 대로 구성하여 대신 사용합니다. 아래의 리스트는 Meta 및 GTM user_data 매개변수에 대한 모든 매핑과 이벤트 매칭 품질을 높이는 데 도움이 되는 일반적 우선순위를 나타냅니다. Meta 광고를 최대한 활용하려면 통합을 설정할 때 전환 API 모범 사례를 활용하는 것이 좋습니다. 전환 API를 이미 설정했다면 이러한 모범 사례를 고려하여 기존의 설정을 개선하는 것이 좋습니다. 전환 API 모범 사례는 행동당 비용을 낮추어 광고 성과를 개선하는 데 도움을 줄 수 있습니다.

전환 API Meta 매개변수GA4 필드 이름GTM 데이터 레이어 변수 이름우선순위

이메일

email_address(em)

user_data.email_address

eventModel.user_data.email_address

높음

클릭 ID

fbc

x-fb-ck-fbc

해당 없음

높음

Facebook 로그인 ID fb_login_id

user_data.fb_login_id

해당 없음

중간

생년월일

db

x-fb-ud-db

해당 없음

중간

국가

country(country)

user_data.address.country

eventModel.user_data.address.country

중간

전화번호

phone_number(ph)

user_data.phone_number

eventModel.user_data.phone_number

중간

외부 ID

external_id

x-fb-ud-external_id

해당 없음

중간

브라우저 ID

fbp

x-fb-ck-fbp

해당 없음

중간

주/도

state(st)

user_data.address.region

eventModel.user_data.address.region

중간

성별

ge

x-fb-ud-ge

해당 없음

중간

이름

first_name(fn)

user_data.address.first_name

eventModel.user_data.address.first_name

낮음

last_name(ln)

user_data.address.last_name

eventModel.user_data.address.last_name

낮음

시/군

city(ct)

user_data.address.city

eventModel.user_data.address.city

낮음

우편번호 postal_code(zip)

user_data.address.postal_code

eventModel.user_data.address.postal_code

낮음


2단계: GA4 이벤트 – 이벤트 스키마를 서버로 전달하도록 구성

  • Google 애널리틱스를 추가하기 위해 생성된 태깅 서버로 웹사이트 데이터를 전송하도록 웹 컨테이너를 구성합니다. Google 애널리틱스: GA4 구성 태그를 구성하는 방법에 대해 자세히 알아보세요.

  • 템플릿 갤러리에서 Google 애널리틱스: GA4 이벤트 태그를 Workspace에 추가합니다.

    • 태그에 이벤트 이름을 설정합니다. 이벤트 이름을 고정 값으로 설정하거나 변수에서 읽어오도록 설정할 수 있습니다. 특정 표준 이벤트의 경우 Google 애널리틱스 표준 이벤트를 Meta 표준 이벤트에 매핑합니다. 이러한 이벤트에 Google 애널리틱스 이벤트 이름이나 Meta 이벤트 이름을 사용할 수 있습니다. 그 외의 다른 표준 이벤트에는 Meta 이벤트 이름을 사용합니다. 맞춤 이벤트에는 맞춤 이벤트의 이름을 사용합니다. 자세히 알아보세요.
Meta 표준 이벤트 이름Google 애널리틱스 이벤트 이름

AddPaymentInfo

add_payment_info

AddToCart

add_to_cart

AddToWishlist

add_to_wishlist

PageView

gtm.dom

PageView

page_view

Purchase

purchase

Search

search

InitiateCheckout

begin_checkout

Lead

generate_lead

ViewContent

view_item

CompleteRegistration

sign_up


  • 이벤트 매개변수 섹션에서:

    • Meta 픽셀을 사용하는 경우 이벤트 ID 매개변수를 추가하세요. event_id를 매개변수 이름으로 사용하고 해당 이벤트 ID에 대해 생성된 변수를 매개변수 값으로 사용합니다. 이벤트 ID 변수를 만들고 Meta 픽셀을 수정하기 위한 지침은 중복 제거 섹션을 참조하세요.
    • 구성하고자 하는 각 매개변수를 매핑합니다. 변수 이름은 공통 이벤트 스키마를 사용하여 이벤트에서 읽어옵니다. 예를 들어 이메일을 이벤트 매개변수로 설정하려면 매개변수 이름(user_data.email_address)으로 정의하고 값은 email_address를 읽는 변수 이름으로 설정해야 합니다(섹션 1에서 정의).
    • 전체 리스트는 아래의 맞춤 데이터 매개변수 섹션을 참조하세요.

3단계: 이벤트를 Meta에 실행하는 이벤트에 대한 리스너 생성

각 GTM 서버 측 컨테이너에는 GA4 웹 태그에서 구성된 이벤트를 수신하는 기본 GA4 클라이언트가 제공됩니다. GA4 클라이언트는 태깅 서버 URL에서 /g/collect 경로를 수신하고 eventModel을 다운스트림 태그로 보냅니다. 기본 GA4 클라이언트가 클라이언트 섹션의 서버 클라이언트에 이미 설치되어 있는 경우 4단계로 이동할 수 있습니다.

4단계: Meta 전환 API 태그(GA4 클라이언트에서 전환 API 이벤트 스키마로 표준 이벤트를 변환하고 graph.facebook.com으로 보내는 서버 측 태그) 생성

이벤트를 전환 API로 보내려면 템플릿 갤러리에서 Meta 전환 API 태그를 설치해야 합니다. 이 템플릿 태그는 facebookincubator에서 전환 API 태그라고 부릅니다. 이 태그는 이전 단계에서 GA4 클라이언트가 수신하여 전환 API로 보낸 이벤트에서 트리거되도록 설정할 수 있습니다. Meta 전환 API 태그를 설치하려면 픽셀 ID, 액세스 토큰이 있어야 하고 행동 출처를 '웹사이트'로 지정해야 합니다. 전환 API를 사용하면 회원님이 아는 한도 내에서 action_source 매개변수가 정확하다는 데 동의하게 됩니다.

통합 테스트

변경 사항을 게시하기 전에 Google 태그 관리자의 미리 보기 모드를 사용하여 통합을 테스트하는 것이 좋습니다. 웹 컨테이너와 서버 컨테이너는 모두 미리 보기 모드가 있으며 두 개를 동시에 실행할 수 있습니다.

미리 보기 모드를 실행하는 동안 설정을 변경하는 경우 미리 보기 모드를 다시 시작하여 테스트 중에 변경 사항이 반영되도록 하세요.

이벤트 관리자에서 테스트 이벤트 기능을 사용하여 서버 이벤트가 의도한 대로 수신되었는지 확인할 수 있습니다. 도구를 찾으려면 이벤트 관리자 > 데이터 소스 > 픽셀 > 테스트 이벤트로 이동하세요.

테스트 이벤트 도구에서 테스트 ID를 생성합니다. 테스트 ID를 전환 API 태그의 test_event_code 매개변수로 보내면 테스트 이벤트 창에서 이벤트 활동이 나타나기 시작합니다. 변경 사항을 게시하기 전에 이를 반드시 삭제하세요.

테스트 이벤트 도구를 사용하면 이벤트가 올바르게 수신되고 중복 제거되는지 확인할 수 있습니다. 1~2분 후에도 이벤트가 나타나지 않을 경우 GTM 서버 측 디버거를 확인하여 요청이 전달되었는지 확인하세요.

  1. 서버 측 디버거의 왼쪽 메뉴에서 확인하고자 하는 관련 이벤트를 선택합니다.
  2. 실행된 태그 섹션에 태그가 표시되고 있는지 확인합니다. 태그가 표시되고 있다면 전환 API 태그 - 성공함 또는 전환 API 태그 - 실패함이 보일 것입니다.
    • 태그가 실행되지 않음: 웹 컨테이너에서 전환 API 태그 트리거와 관련 GA4 이벤트 트리거를 검토합니다. 웹 디버거에서 GA4 이벤트가 실행되었는지 확인합니다.
    • 태그 실행됨: 성공함: 태그를 클릭하여 테스트 이벤트 코드가 올바른지 확인합니다. 필요한 경우 테스트 이벤트 코드를 업데이트하고 미리 보기 모드를 다시 시작합니다.
    • 태그 실행됨: 실패함: 요청 탭을 열고 https://graph.facebook.com으로 전송되는 발송 요청을 클릭합니다. 요청 상세 정보 하단의 응답 본문을 검토하여 오류가 무엇인지 확인하고 통합을 적절히 업데이트합니다. 변경 사항을 적용한 후에는 미리 보기 모드를 다시 시작합니다.

이벤트가 표시되면 각 이벤트의 이벤트 ID가 올바르게 전송되고 있는지, 모든 예상 매치 키와 맞춤 데이터 매개변수가 올바르게 표시되고 있는지 확인합니다. 테스트 이벤트 도구에는 이벤트가 올바르게 중복 제거되는 중인지 표시됩니다. 이벤트 ID가 다를 경우 GA4와 Meta 픽셀 태그가 동일한 트리거에서 실행되는지 확인하고 이벤트 ID 변수 구현을 검토합니다.

중복 제거

중복된 이벤트 설정을 사용하고 전환 API와 Meta 픽셀에서 동일한 이벤트를 공유하는 것이 좋습니다. 두 이벤트 모두 동일한 event_name을 사용하고 event_id 또는 external_idfbp의 조합이 포함되도록 해야 합니다.

그러면 Meta가 이벤트에서 중복을 제거하고 동일한 이벤트의 이중 보고를 줄이는 데 도움이 됩니다. 중복 제거와, 중복 제거가 필요한 이유 및 설정 방법에 대해 자세히 알아보세요. external_id 및 fbp는 중복 제거에 대신 사용할 수 있는 솔루션이며, 설정 품질을 개선하는 데도 도움이 됩니다. 가능한 이 세 가지 매개변수를 포함하는 것이 좋습니다.

GTM에는 브라우저 태그와 서버 태그에서 동일한 값으로 매개변수를 설정하는 여러 가지 방법이 있습니다. 그중 한 가지 방법이 동일한 GA4 이벤트를 트리거로 사용하여 Meta 픽셀 태그와 서버 이벤트를 실행하는 것입니다. 이 방법을 사용하려면 다음 단계를 따르세요.

  • Meta 픽셀 맞춤 HTML 태그와 GA4 이벤트 태그에 동일한 트리거를 사용합니다. 예를 들어 주문 확인 페이지 URL을 기반으로 트리거 조건을 정의할 수 있습니다.
  • 두 태그에 동일한 event_id 사용:
    1. 클라이언트에서 고유한 ID 설정: gtag 이벤트에서 맞춤 매개변수(x-fb-event_id)를 설정합니다. 웹사이트에서 JavaScript 메서드(또는 Google 태그 관리자 맞춤 JavaScript 변수)로 (각 이벤트에) 고유한 ID를 생성하고 다음과 같이 이벤트에 값을 설정합니다.
    2. gtag('event', 'purchase', {
       'x-fb-event_id': generateEventId(),
      ...:...
      
       });
      위와 같은 맞춤 Javascript를 가리키는 변수를 생성할 수 있습니다. 변수를 참조할 때마다 아래의 Javascript를 인라인으로 읽어들입니다.
      function() {
      var gtmData = window.google_tag_manager[{{Container ID}}].dataLayer.get('gtm');
      return gtmData.start + '.' + gtmData.uniqueEventId;
      }
    3. 데이터 레이어 변수 만들기 및 채우기: 웹 컨테이너에서 자체 변수를 만들어 event_id로부터 값을 읽을 수 있습니다. 새로운 데이터 레이어 변수(예: FBEventIdVar)를 만들고 데이터 레이어 변수 이름을 eventModel.event_id로 지정하면 됩니다.
    4. 변수가 설정되면 맞춤 HTML 태그에서 웹 이벤트와 변수를 연결하고 서버 이벤트는 추가적 GA4 이벤트 매개변수로 설정합니다.
    5. 웹의 경우 변수에서 event_id를 읽도록 Google 태그 관리자 웹 컨테이너에서 Meta 태그를 설정할 수 있습니다.
    6. fbq('track', Purchase, {..}, {eventID: FBEventIDVar });
      이름이 event_id로 지정되고 FBEventIdVar 변수로 설정된 추가 매개변수를 전송하도록 GA4 이벤트를 구성합니다.

맞춤 데이터 매개변수

맞춤 데이터를 보내려면 GA4 이벤트 태그에서 아래의 매핑을 사용합니다.

Meta 매개변수 이름GA4 매개변수 이름

통화

통화

search_string

search_term

order_id

transaction_id

content_ids

x-fb-cd-content_ids

content_type

x-fb-cd-content_type

content_name

x-fb-cd-content_name

content_category

x-fb-cd-content_category

contents*

items OR x-fb-cd-contents

num_items

x-fb-cd-num_items

predicted_ltv

x-fb-cd-predicted_ltv

status

x-fb-cd-status

delivery_category

x-fb-cd-delivery_category

custom_properties*

custom_properties

x-fb-cd-contentscustom_properties는 Meta에서 정의한 JSON 매개변수이므로 전송하기 전에 JSON 문자열로 변환해 주세요.

웹사이트에서 GCP 서버로 데이터 전송

웹 및 서버 컨테이너를 구성하고 나면 웹사이트에서 샘플 이벤트를 보내 서버 이벤트를 확인할 수 있습니다. 구성된 매개변수가 포함된 샘플 이벤트는 다음과 같습니다.

 gtag('event', 'purchase', 
  {
    'event_id': generateEventId(),
    'transaction_id': 't_12345',
    'currency': 'USD',
    'value': 1.23,
    user_data: {
      email_address: '<HASHED_DATA>',
      phone_number: '<HASHED_DATA>',
      address: {
        first_name: '<HASHED_DATA>',
        last_name: '<HASHED_DATA>',
        city: '<HASHED DATA>',
        region: '<HASHED_DATA>',
        postal_code: '<HASHED_DATA>',
        country: '<HASHED_DATA>'     
      },    
    },
    items: [
      {
        item_id: '1',
        item_name: 'foo',
        quantity: 5,
        price: 123.45,
        item_category: 'bar',
        item_brand: 'baz'     
      }
    ], 
  });      
     

이벤트가 트리거되면 구성된 매개변수와 함께 전송된 요청(예: 샘플 링크: www.analytics.example.com/g/collect)을 확인할 수 있습니다. 테스트 이벤트 코드를 Meta 전환 API 태그에 추가해 전환 API에 전송된 이벤트를 확인할 수 있습니다. 테스트 이벤트 코드는 테스트에만 사용할 수 있습니다. 프로덕션 페이로드 전송 시 이를 삭제해야 합니다.

변경 사항을 게시한 후에 이곳의 설정 확인 페이지에서 다음 설정 확인 - 전환 API를 확인하여 이벤트가 올바르게 전송되고 있는지 확인하고 품질 통합이 Meta 모범 사례를 준수하고 있는지 검토하세요.

자주 묻는 질문

맞춤 매개변수를 전송하는 기능을 추가할 계획이 있나요? 그러한 계획이 있다면 언제 사용할 수 있나요?
A: GTM 스키마에서 지원되는 대부분의 전환 API의 표준 맞춤 매개변수에 대해 매핑을 추가했습니다. 또한 맞춤 매핑도 제공했습니다. 자세한 내용은 여기를 참조하세요.

단일 서버 또는 클러스터에서 여러 컨테이너를 실행할 수 있나요?
A: 현재 GTM은 1:1 매핑만 지원합니다. 컨테이너를 구성하는 방법에 대한 권장 사항을 읽어보세요.

서버 측 GTM이 이벤트를 내보내려면 브라우저 기반 태그가 필요한가요?
A: 예.

GA4를 서버 측 통합과 별도로 유지할 수 있나요?
A: 별도의 GA4 및 서버 측 GTM 통합을 유지하려면 Google 애널리틱스에서 추가적인 측정 ID를 만들면 됩니다. 위의 단계에 따라 이 측정 ID를 사용하여 서버 측 GTM에 대한 별도의 GA4 구성 태그를 만듭니다. 이 시나리오에서 기존의 GA4 구성 태그는 웹 컨테이너를 통해 GA 트래픽을 계속 전송하겠지만, 새 구성 태그는 서버 컨테이너로 데이터를 전송합니다. 2단계에 따라 새로운 구성 태그를 사용하여 서버 측으로 이벤트를 보내기 위한 추가적인 GA4 이벤트 태그를 만듭니다.

GTM 전환 API 통합이 GCP 외의 클라우드 호스팅 솔루션과 호환되나요?
A: GTM 전환 API 통합은 GCP 또는 기타 선택한 모든 플랫폼과 호환됩니다. 수동 프로비저닝에 대한 자세한 내용은 여기를 참조하세요.