Platform Web SDK 데이터를 사용하여 이벤트 전달 설정
Adobe Experience Platform Web SDK 데이터로 이벤트 전달을 사용하는 방법을 알아봅니다.
이벤트 전달은 데이터 수집에서 사용할 수 있는 새로운 유형의 속성입니다. 이벤트 전달을 사용하면 기존의 클라이언트측 Edge Network 대신 Adobe Experience Platform 브라우저에서 직접 서드파티 비 Adobe 공급업체에 데이터를 전송할 수 있습니다. 이벤트 전달 개요에서 이벤트 전달의 장점에 대해 자세히 알아보세요.
Adobe Experience Platform에서 이벤트 전달을 사용하려면 먼저 다음 세 가지 옵션 중 하나 이상을 사용하여 Adobe Experience Platform Edge Network으로 데이터를 보내야 합니다.
이 자습서의 이전 단원을 완료한 후에는 웹 SDK를 사용하여 Platform Edge Network에 데이터를 전송해야 합니다. 데이터가 플랫폼 Edge Network에 있으면 이벤트 전달을 활성화하고 이벤트 전달 속성을 사용하여 Adobe이 아닌 솔루션으로 데이터를 전송할 수 있습니다.
학습 목표
이 단원을 마치면 다음을 수행할 수 있습니다.
- 이벤트 전달 속성 만들기
- Platform Web SDK 데이터스트림에 이벤트 전달 속성 연결
- 태그 속성 데이터 요소와 규칙의 차이점과 이벤트 전달 속성 데이터 요소와 규칙의 차이점을 이해합니다
- 이벤트 전달 데이터 요소 만들기
- 이벤트 전달 규칙 구성
- 이벤트 전달 속성이 데이터를 성공적으로 보내고 있는지 확인합니다.
전제 조건
-
이벤트 전달이 포함된 소프트웨어 라이센스입니다. 이벤트 전달은 데이터 수집의 유료 기능입니다. 자세한 내용은 Adobe 계정 팀에 문의하십시오.
-
Experience Cloud 조직에서 이벤트 전달이 활성화됩니다.
-
이벤트 전달에 대한 사용자 권한. (Admin Console의 Adobe Experience Platform Launch 제품에서 플랫폼 > Edge 및 모든 속성 권한에 대한 권한 항목). 권한이 부여되면 데이터 수집 인터페이스의 왼쪽 탐색 영역에 이벤트 전달이 표시됩니다.
-
Adobe Experience Platform 웹 또는 Mobile SDK가 데이터를 Edge Network으로 보내도록 구성되었습니다. 이 자습서의 다음 단원을 완료해야 합니다.
이벤트 전달 속성 만들기
먼저 이벤트 전달 속성을 만듭니다.
-
데이터 수집 인터페이스 열기
-
왼쪽 탐색에서 이벤트 전달 선택
-
새 속성 을 선택합니다.
-
속성 이름을 지정합니다. 이 경우
Server-Side - Web SDK Course -
저장 을 선택합니다.
데이터 스트림 구성
이벤트 전달에서 플랫폼 Edge Network으로 전송하는 데이터를 사용하려면 새로 만든 이벤트 전달 속성을 Adobe 솔루션으로 데이터를 전송하는 데 사용되는 동일한 데이터 스트림에 연결해야 합니다.
데이터 스트림에서 Target을 구성하려면 다음 작업을 수행하십시오.
-
데이터 수집 인터페이스로 이동
-
왼쪽 탐색에서 데이터스트림 을 선택합니다.
-
이전에 만든
Luma Web SDK: Development Environment데이터스트림 선택
-
서비스 추가 선택
-
이벤트 전달 을(를) 서비스(으)로 선택
-
속성 ID 드롭다운 아래에서 이벤트 전달 속성에 지정한 이름을 선택합니다(이 경우
Server-Side - Web SDK Course). -
환경 ID 드롭다운 아래에서 이벤트 전달 환경을 연결할 태그 환경을 선택합니다(이 경우
Development).note tip TIP Adobe 조직 외부의 이벤트 전달 환경으로 데이터를 보내려면 ID를 수동으로 입력 을 선택하고 ID에 붙여 넣으십시오. 이벤트 전달 속성을 만들 때 ID가 제공됩니다. -
저장 을 선택합니다.
게시 플로우를 통해 변경 사항을 승격할 준비가 되면 스테이징 및 프로덕션 데이터스트림에 대해 이 단계를 반복합니다.
플랫폼 Edge Network에서 Adobe이 아닌 솔루션으로 데이터 전달
이 연습에서는 Webhook.site라는 세 번째 부분 도구를 사용하여 이벤트 전달 데이터 요소를 설정하고 이벤트 전달 규칙을 구성하고 유효성을 검사하는 방법을 알아봅니다.
이벤트 전달 데이터 요소 만들기
Platform Web SDK 태그 확장을 사용하여 이전에 구성한 XDM 개체는 이벤트 전달 속성에서 데이터 요소의 데이터 소스가 됩니다. 태그 속성에 이미 구성한 것과 동일한 데이터를 이벤트 전달을 위한 데이터 소스로 사용합니다.
arc.event 접두사를 포함해야 합니다.arc는 Adobe 응답 컨텍스트를 나타냅니다.- 예:
arc.event.xdm.web.webPageDetails.URL
이 연습에서는 브라우저 뷰포트 높이와 Experience Cloud ID를 XDM 개체에서 웹후크로 전달합니다. XDM 필드 경로는 XDM 스키마 구성 단원 중에 만든 XDM 스키마에 의해 결정됩니다.
/ee 요청을 필터링하고, 비콘 페이로드 를 열고, 원하는 변수로 드릴다운하여 XDM 개체 경로를 찾을 수도 있습니다. 그런 다음 마우스로 마우스 오른쪽 단추를 클릭하고 "속성 경로 복사"를 선택합니다. 다음은 브라우저 뷰포트 높이에 대한 예입니다.
-
최근에 만든 이벤트 전달 속성으로 이동합니다.
-
왼쪽 탐색에서 데이터 요소 를 선택합니다.
-
새 데이터 요소를 만들려면 선택
-
데이터 요소
environment.browserDetails.viewportHeight의 이름 -
확장 에서
CORE나가기 -
데이터 요소 형식 에서
Path을(를) 선택합니다. -
브라우저 뷰포트 높이
arc.event.xdm.environment.browserDetails.viewportHeight이(가) 포함된 XDM 개체 경로를 입력합니다. -
저장 선택
-
다른 데이터 요소 만들기
-
ecid에 대해 이름 -
확장 에서
CORE나가기 -
데이터 요소 형식 에서
Path을(를) 선택합니다. -
Experience Cloud ID
arc.event.xdm.identityMap.ECID.0.id이(가) 포함된 XDM 개체 경로를 입력하십시오. -
저장 선택
note caution CAUTION 경로에 arc.event.접두사를 포함해야 합니다. 또한 XDM 개체 필드 이름과 정확히 일치하는 대/소문자를 따라야 합니다. 즉, ECID 네임스페이스는 모두 대문자로 표시되어야 합니다.note tip TIP 자체 웹 사이트에서 작업할 때 웹 브라우저 네트워크 도구를 사용하여 XDM 개체 경로를 찾고, /ee요청을 필터링하고, 비콘 페이로드 를 열고, 원하는 변수로 드릴다운할 수 있습니다. 그런 다음 마우스로 마우스 오른쪽 단추를 클릭하고 "속성 경로 복사"를 선택합니다. 다음은 브라우저 뷰포트 높이에 대한 예입니다.
Adobe Cloud Connector 확장 설치
데이터를 타사 위치로 보내려면 먼저 Adobe 클라우드 커넥터 확장을 설치합니다.
-
왼쪽 탐색에서 확장 선택
-
카탈로그 탭 선택
-
Adobe 클라우드 커넥터 를 검색하고 설치 를 선택합니다.
확장 구성이 필요하지 않습니다. 이제 이 확장을 사용하여 데이터를 Adobe이 아닌 솔루션으로 전달할 수 있습니다!
이벤트 전달 규칙 만들기
태그 속성의 규칙 구성과 이벤트 전달 속성의 규칙 간에는 몇 가지 주요 차이점이 있습니다.
-
이벤트 및 조건:
- 태그: 모든 규칙은 규칙에 지정해야 하는 이벤트(예:
Library Loaded - Page Top)에 의해 트리거됩니다. 조건은 선택 사항입니다. - 이벤트 전달: 플랫폼 Edge Network에 전송된 모든 이벤트는 데이터를 전달하는 트리거라고 가정합니다. 따라서 이벤트 전달 규칙에서 선택해야 하는 이벤트가 없습니다. 이벤트 전달 규칙을 트리거하는 이벤트를 관리하려면 조건을 구성해야 합니다.
- 태그: 모든 규칙은 규칙에 지정해야 하는 이벤트(예:
-
데이터 요소 토큰화:
-
태그: 데이터 요소 이름은 규칙에 사용할 때 데이터 요소 이름의 시작 및 끝에
%(으)로 토큰화됩니다. 예:%viewportHeight%. -
이벤트 전달: 데이터 요소 이름은 규칙에 사용할 때 데이터 요소 이름의 시작 부분에서
{{, 끝 부분에서}}(으)로 토큰화됩니다. 예:{{viewportHeight}}.
-
-
규칙 작업 순서:
- 이벤트 전달 규칙의 작업 섹션은 항상 순차적으로 실행됩니다. 규칙을 저장할 때 작업 순서가 올바른지 확인하십시오. 이 실행 시퀀스는 태그를 사용할 때처럼 비동기식으로 실행할 수 없습니다.
데이터를 웹후크에 전달하는 규칙을 구성하려면 먼저 개인 웹후크를 얻어야 합니다.
-
Webhook.site(으)로 이동
-
고유 URL 을(를) 찾으십시오. 이벤트 전달 규칙에서 URL 요청으로 사용합니다.
-
클립보드에 복사 선택
-
Webhook에 의해 캡처되는 이벤트 전달 데이터를 실시간으로 확인할 수 있으므로 이 창을 열어 두십시오
-
왼쪽 탐색에서 데이터 수집 > 이벤트 전달 > 규칙(으)로 돌아가기
-
새 규칙 만들기 선택
-
이름을
all events - ad cloud connector - webhook로 지정합니다. -
작업 추가
-
확장 에서 Adobe 클라우드 커넥터 를 선택합니다.
-
작업 유형 에서 가져오기 호출 수행 을 선택합니다.
-
URL 필드에 웹후크 URL 붙여넣기
-
[쿼리 매개 변수] 에서 이전에 만든 데이터 요소를 모두 추가합니다.
-
viewPortHeight의 Key 열 형식에서. 값 열에서{{environment.browserDetails.viewportHeight}}데이터 요소를 입력하거나 데이터 요소 선택기 아이콘에서 선택하여 입력합니다 -
다른 쿼리 매개 변수를 추가하려면 + 다른 쿼리 매개 변수 추가 를 선택하십시오.
-
ecid의 Key 열 형식에서. 값 열에서{{ecid}}데이터 요소를 입력합니다 -
변경 내용 유지 선택
-
규칙은 다음과 같아야 합니다.
-
저장 선택
라이브러리 만들기 및 빌드
라이브러리를 만들고 일반적인 태그 속성에서와 마찬가지로 이벤트 전달 개발 환경에 대한 모든 변경 사항을 빌드합니다.
이벤트 전달 규칙 확인
이제 Platform Debugger 및 Webhook.site를 사용하여 이벤트 전달 속성을 확인할 수 있습니다.
-
🔗태그 라이브러리를 Luma 데모 사이트에서 을(를) 데이터 스트림에서 이벤트 전달 속성을 매핑한 Web SDK 태그 속성으로 전환하려면 단계를 따르십시오.
-
페이지를 다시 로드하기 전에 Experience Platform 디버거에서 왼쪽 탐색에서 로그 를 엽니다.
-
Edge 탭을 선택한 다음 연결 을 선택하여 Platform Edge Network 요청을 봅니다
-
페이지 다시 로드
-
Platform Edge Network이 WebHook으로 전송하는 서버측 요청을 확인할 수 있는 추가 요청이 표시됩니다
-
포커스 유효성 검사 요청은 Edge 네트워크에서 전송하는 완전히 구성된 URL을 표시하는 요청입니다
-
viewPortHeight 및 ecid 쿼리 문자열 매개 변수를 확인합니다.
-
XDM 개체에 표시되는 데이터와 일치합니다
-
마지막으로 열려 있는 Webhook 창을 보고 Webhook.site에서도 데이터가 일치하는지 확인합니다
축하합니다! 이벤트 전달을 구성했습니다!