페이스북 픽셀 api - peiseubug pigsel api

안녕하세요, 데이터 기반 마케팅 솔루션&컨설팅 AB180입니다.

이번에는 페이스북 광고 성과 트래킹 시리즈로 찾아왔습니다! 광고 측정에 관심이 많으신 분들은 이미 페이스북 픽셀을 활용한 이벤트 측정은 많이 접해 보시고 실제로 진행도 해 보셨을 텐데요.

이번 시리즈를 통해 페이스북 픽셀과 Conversion API는 어떻게 다른지, 왜 Conversion API가 중요해지고 있는지, Conversion API는 어떻게 구성되어 있는지 하나씩 알아보도록 하겠습니다.😀

Conversion API란 전환 API로서 웹사이트에서 발생하는 이벤트 데이터를 웹 브라우저를 거치지 않고 웹사이트의 서버에서 페이스북 서버로 바로 전송하는 API를 의미합니다. 웹 브라우저 개입 없이 서버간에 이벤트 데이터를 주고 받을 수 있기 때문에 페이스북은 기존에 Conversion API를 Server-Side API로 불렀습니다.

Conversion API도 픽셀과 마찬가지로 웹사이트에서 발생하는 이벤트 데이터를 수집하는 데 활용되는데요. 그렇다면 픽셀과 Conversion API는 어떤 차이가 있을까요? 

페이스북 픽셀과 Conversion API는 어떻게 다른가요? 

페이스북 픽셀 알아보기

페이스북 픽셀 api - peiseubug pigsel api

기존에 많이 활용된 페이스북 픽셀은 웹사이트에 Javascript 형태로 설치되어 페이스북 이벤트 데이터를 수집합니다. 기본적으로는 페이스북이 제공하는 코드뭉치를 삽입하는 방식으로 진행하게 되며, 웹 브라우저 내에서 Script가 정상적으로 작동하지 않는 경우를 대비해 1x1 px의 이미지를 <noscript> 태그와 함께 호출해서 URL Parameter로 이벤트 데이터를 전송하는 방식을 활용합니다. 이 보이지않는 1x1 px의 이미지를 활용하기 때문에 ‘픽셀’이라는 명칭이 붙게 되었습니다.

페이스북 픽셀을 활용하면 고객의 행동 데이터가 아래의 경로로 이동하게 됩니다.

페이스북 픽셀 api - peiseubug pigsel api

1. 고객이 웹사이트에 방문

2. 웹사이트에 삽입되어 있는 픽셀을 통해 고객의 행동 이벤트 데이터를 수집 (e.g : PageView, CompleteRegistration, Purchase…)

3. 페이스북 Script를 통해 수집한 정보가 쿠키와 함께 페이스북 서버로 전달 

페이스북 픽셀로 이벤트 데이터를 수집할 때에는 고객의 행동 데이터가 페이스북 쿠키와 함께 브라우저를 통해 전달되기 때문에 브라우저의 역할이 무엇보다 중요하다고 할 수 있습니다.

Conversion API 알아보기

앞서 Conversion API 에서는 웹 브라우저를 거치지 않고 웹사이트의 서버에서 페이스북 서버로 이벤트 데이터를 바로 전송한다고 말씀드렸는데요. 픽셀이 페이스북 쿠키를 웹 브라우저에 저장했다가 페이스북 서버로 전달하는 것과 달리, Conversion API 방식에서는 페이스북 서버에서 웹사이트 서버에 데이터를 요청하고 웹사이트 서버가 요청받은 데이터를 전달해주는 방식으로 데이터가 전달됩니다.

페이스북 픽셀 api - peiseubug pigsel api

Conversion API에서는 서버를 통해서 웹사이트에서 발생하는 이벤트를 User Key Information과 함께 전달합니다.  페이스북이 제공하는 API에서 user_data 파라미터를 활용해 고객의 정보를 전달할 수 있는데요. user_data 파라미터에서 Browser ID와 Click ID를 각각 fbp와 fbc 파라미터로 설정해서 페이스북 쿠키를 포함시킬 수 있습니다.

또한, user_data에는 이메일, 이름, 생년월일 등의 개인정보를 암호화하여 포함할 수 있기 때문에 페이스북에서 활동한 고객과 웹사이트에서 활동한 고객이 동일 고객인지 확인할 수 있는데요. 고객이 비회원인 상태로 웹사이트를 이용할 수도 있고, 경우에 따라 개인정보를 활용하지 못할 수도 있기 때문에 페이스북에서는 Browser ID(fbp) 와 Click ID(fbc) 를 반드시 포함하는 것을 권장하고 있습니다. 

fbp와 fbc가 어떻게 쿠키에 저장되는지 자세히 알아보겠습니다. 

fbp & fbc 파라미터

fbp와 fbc는 픽셀이 제한될 때 페이스북 쿠키를 전달하는 수단으로 활용됩니다. 특히 fbc의 경우 Click ID를 담을 수 있는 파라미터로서, 광고를 클릭하는 순간에 유저 정보를 웹사이트에 전달하는 수단이기 때문에 필수적으로 활용해야 하는 아주 중요한 파라미터입니다. 

fbp(Browser ID)

웹사이트에서 페이스북 픽셀이 설치되어 있고 First-party 쿠키를 사용한다면 웹사이트 도메인에서 Unique Identifier를 _fbp 쿠키에 저장합니다. 

  • First-party 쿠키: 사용자가 방문한 웹사이트에서 직접 발행하는 쿠키
  • Third-party 쿠키:  사용자가 방문한 웹사이트가 아닌 곳에서 발행한 쿠키로, 페이스북에서 발행하는 쿠키도 여기에 해당

fbc(Click ID)

고객이 페이스북 광고를 클릭할 때, 해당 광고 링크는 fbclid 쿼리파라미터를 포함합니다. 고객이 링크를 클릭해서 웹사이트에 들어왔을 때 웹사이트가 First-party 쿠키를 사용한다면 픽셀에서 자동적으로 fbclid 쿼리 파라미터를 _fbc 쿠키에 저장합니다. 설치되어 있는 페이스북 픽셀이 없거나 First-party 쿠키가 꺼져 있는 경우에도 fbclid 쿼리파라미터가 Request URL에 포함되어 있다면 fbc를 서버로 전달하는 것이 가능합니다.

마치며

지금까지 픽셀과 Conversion API는 어떤 차이가 있는지, 그리고 Conversion API에서는 어떻게 데이터를 전달하는지 알아보았습니다. 페이스북 픽셀은 Third-party 쿠키에 의존하기 때문에 Ad Blocker나 브라우저의 정책 변화에 따라 많은 영향을 받을 수밖에 없습니다. Conversion API는 세팅 시간이 더 많이 소요되기는 하지만, 서버에서 서버로 데이터가 곧바로 이동하기 때문에 픽셀 대비 데이터 누락 없이 정확한 트래킹이 가능합니다. 

데이터를 안전하고 정확하게 전달할 수 있다는 것 외에도 Conversion API의 장점은 여러 가지가 있는데요. 이번 시리즈 다음 포스트를 통해 Conversion API의 도입을 고려해야 하는 이유에 대해 조금 더 자세히 이야기해 보도록 하겠습니다.

페이스북 픽셀 api - peiseubug pigsel api

「페이스북 전환 API(Conversion API) 설정하기」

안녕하세요. 디비카트입니다.

페이스북 효율적인 광고를 위해 필요한 전환 API 설정방법에 대해서 포스팅을 해보겠습니다.

페이스북 픽셀과 전환 API 차이점?

픽셀은 웹 브라우저 발생하는 이벤트 데이터를 추적하는 방식이며, 전환 API는 서버에서 이벤트 데이터를 추적하는 방식의 차이점이 있습니다.

(최근 IOS 14 업데이트에 브라우저 추적에 대한 사용권한을 설정할 수 있도록 변경되어 전환 API 방식을 사용하고 있습니다.)



페이스북 전환 API연동 주요 순서
1. 이벤트 관리자에서 픽셀생성
2. 생성된 픽셀값으로 디비카트에 입력
3. 디비카트에서 테스트 이벤트 전송
4. 연동완료후 픽셀 사용

페이스북 픽셀 api - peiseubug pigsel api





2. 데이터 소스 연결(픽셀 & 전환 API 추가)

1) 데이터 소스 연결 선택합니다.

2) 새 데이터 소스 연결

① 웹 선택합니다.

② 연결 선택합니다.

3) 픽셀 만들기
① 픽셀 이름을 입력합니다.
② 픽셀 만들기 선택합니다.

4) 파트너 통합 확인
① 웹사이트 URL 입력합니다.
② 확인 선택합니다.

5) 웹사이트 연결할 방법
① 전환 API 및 Meta 픽셀 선택합니다.
② 다음 선택합니다.

6) 전환 API 설정할 방법
① 직접 설정 선택합니다.
② 다음 선택합니다.

페이스북 픽셀 api - peiseubug pigsel api

3 전환 API를 사용하여 웹사이트 활동 연결

1) 수동 구현 개요이며, 계속 선택합니다.

2) 이벤트 선택
① 등록 완료 선택합니다.
② 계속 선택합니다.

3) 매개변수 선택
① 사용할 이벤트 매개변수를 선택합니다.(페이스북으로 전달할 매개변수를 선택하시면 됩니다.)
② 계속 선택합니다.

4) 설정 검토, 선택한 이벤트 매개변수가 맞는지 확인 후 계속 선택합니다.


5) 안내 보기, 픽셀 설정 계속하기 선택합니다.

페이스북 픽셀 api - peiseubug pigsel api

4 전환 API를 사용하여 웹사이트 활동 연결



1) 픽셀을 사용하여 웹사이트 활동 연결 방법 선택, 코드 직접 설치 선택합니다.

2) 기본 코드 설치
① 코드 복사 선택합니다.
② 계속 선택합니다.

▶ 픽셀코드 디비카트 플랫폼 등록하기 시작 ◀

2-1) 기본 코드 메모장 등록
① 이미지 붉은색 테두리 위치에 숫자로 된 코드가 존재하며, 해당 코드를 저장합니다.

2-2) 디비카트 픽셀 등록하기
경로 : 디비카트 로그인 > ① 랜딩관리 > ② 랜딩 홍보하기 > ③ 픽셀관리
픽셀코드 등록하기 : 
④ 픽셀코드를 입력합니다.
⑤ 저장하기 선택합니다.

▶ 픽셀코드 디비카트 플랫폼 등록하기 완료 ◀

3) 자동 고급 매칭
① 자동 고급 매칭 설정 체크합니다.
② 계속 선택합니다.

4) 이벤트 설정 도구를 사용하여 이벤트 추가하기, 계속 선택합니다.

5) 도메인 인증 
① 인증됨 확인합니다.
② 계속 선택합니다.

6) 웹 이벤트 구성, 선택합니다.
6-1) 기본도메인을 선택 후 이벤트 관리 선택합니다.
6-2) 웹 이벤트 구성 수정
① 픽셀명을 선택합니다.(처음 픽셀이름을 등록한 픽셀을 찾습니다.)
② 이벤트 이름 등록 완료 선택합니다.
③ 적용 선택합니다.

7) 설정완료 선택합니다.

페이스북 픽셀 api - peiseubug pigsel api

5 전환 API 사용하기



1) 액세스 토큰 만들기 메뉴 선택합니다.

2) 액세스 토큰 만들기 버튼 선택합니다.


2-1) 토큰 정보가 나타나며, 클릭시 클립보드 복사가 됩니다.


2-2) 디비카트 전환 API 토큰 등록할 위치 찾기
경로 : 디비카트 로그인 > ① 랜딩관리 > ② 랜딩 홍보하기 > ③ 픽셀관리 > ④ 페이스북 픽셀 ID 오른쪽 API 연동 선택합니다.


2-3) 디비카트 전환 API 설정하기
① 전환 API 사용유무 체크합니다.
② 페이스북 토큰 등록합니다.(2-1에서 복사한 토큰을 여기에 붙여넣기를 합니다.)
 전달값 설정합니다.(디비카트를 통해서 받은 데이터를 페이스북 서버로 전달하고 싶으신 값을 선택합니다.)
※ 고객님께서 받으시는 데이터 종류는 많습니다. 하지만 페이스북에서 받는 값은 한정되어 있습니다. 이런부분들을 참고하셔서 페이스북에 받는값과 일치하는 부분만 등록하시면 됩니다.
⑤ 이벤트 테스트 코드 입력합니다.

▶ 이벤트 테스트 코드 등록 방법 시작 ◀

2-4) 구현 관리
① 구현 관리 선택합니다.
② 테스트 이벤트 시작하기 선택합니다.

2-5) 서버 이벤트 테스트, 테스트 코드를 선택시 클립보드 복사 됩니다.
(헤당페이지 하단 우측에서 찾으실 수 있습니다.)
복사한 테스트 코드를 디비카트 이벤트 테스트 코드에 등록합니다.

▶ 이벤트 테스트 코드 등록 방법 완료 ◀

⑥ 이벤트 테스트 선택합니다.

2-6) 정상적으로 등록시 해당 멘트가 뜨며, 확인 선택합니다.

▶ 이벤트가 올바로 수신되는지 확인 시작 ◀
2-7) 이벤트가 올바르게 수신이 되는경우 해당 이벤트가 표시됩니다.
▶ 이벤트가 올바로 수신되는지 확인 완료 ◀

2-8) 최종 테스트 완료 디비카트 설정
① 올바로 수신되는걸 확인 후 디비카트 테스트 내역 확인 체크합니다.
② 저장하기 선택합니다.

페이스북 픽셀 api - peiseubug pigsel api

■ 비즈니스 설정 픽셀 권한 설정■

1) 비즈니스 설정 이동하기
① 이벤트 관리자 왼쪽 상단 가로 세줄로 된 아이콘을 선택합니다.
② 다양한 메뉴가 보이며, 비즈니스 설정 선택합니다.

2) 비즈니스 픽셀 찾기
① 좌측 메뉴중 데이터 소스 > 픽셀 선택합니다.
② 세팅한 픽셀을 선택합니다.

3) 픽셀 사람 추가 찾기
① 설정할 픽셀 선택합니다.
② 우측 사람 선택합니다.
③ 사람 추가 선택합니다.

3-1) 픽셀 사람 추가
① 해당 픽셀에 권한을 줄 사람을 선택합니다.
② 픽셀 관리 권한 추가합니다.
③ 할당 선택합니다.

4) 픽셀 연결된 자산 추가 찾기
① 설정할 픽셀 선택합니다.
② 우측 연결된 자산 선택합니다.
③ 자산 추가 선택합니다.

4-1) 픽셀 연결된 자산 추가
① 해당 픽셀에 권한을 줄 자산을 선택합니다.
 추가 선택합니다.

페이스북 픽셀 api - peiseubug pigsel api

지금까지 페이스북 전환 API(Conversion API) 설정하는 방법에 대해서 포스팅하였습니다.

많은 도움이 되셨으면 합니다.