확장 개발 개요

Adobe Experience Platform Launch의 주요 목표 중 하나는 핵심 Platform Launch 엔지니어링 팀 외부의 엔지니어가 Platform Launch를 통해 추가 기능을 노출할 수 있는 개방형 에코시스템을 구축하는 것입니다. 이는 Reactor 확장을 통해 수행됩니다. 사용자가 Platform Launch 속성에 확장을 설치하면 해당 확장의 기능을 해당 속성의 모든 사용자가 사용할 수 있게 됩니다.

이 문서에서는 서로 다른 확장 유형의 기본 구성 요소에 대해 간략히 설명하고 확장 개발 프로세스를 안내하는 추가 설명서에 대한 링크를 제공합니다.

라이브러리 모듈

라이브러리 모듈은 확장이 제공하는 재사용 가능한 코드 조각으로, Platform Launch 런타임 라이브러리 내에 전달됩니다. 웹 확장 또는 Edge 확장을 개발하는지 여부에 따라 사용 가능한 모듈 유형과 사용 사례가 달라집니다. 각 확장 유형에 대한 모듈의 개요는 다음 하위 섹션을 참조하십시오.

웹 확장 의 모듈

웹 확장에서 규칙은 이벤트를 통해 트리거되며 지정된 조건 세트가 충족될 경우 특정 작업을 실행할 수 있습니다. 자세한 내용은 웹 확장의 모듈 흐름에 대한 개요를 참조하십시오.

Adobe에서 제공하는 코어 모듈 외에도 사용자는 웹 확장에서 다음 라이브러리 모듈 유형을 정의할 수 있습니다.

노트

웹 확장에서 라이브러리 모듈을 구현하는 데 필요한 형식에 대한 자세한 내용은 모듈 형식 개요를 참조하십시오.

이벤트 유형

규칙 이벤트는 규칙이 실행되기 전에 발생해야 하는 일부 활동입니다.

예를 들어, 확장은 특정 마우스 또는 터치 동작의 발생을 감시하는 "제스처" 이벤트 유형을 제공할 수 있습니다. 제스처가 발생하면 이벤트 논리에서 규칙을 실행하게 됩니다.

일반적으로 이벤트 유형은 (1) 사용자가 이벤트의 설정을 수정할 수 있는 Platform Launch 애플리케이션 내의 보기와 (2) 설정을 해석하고 특정 활동이 수행되는지를 감시하는, Platform Launch 런타임 라이브러리 내에 제공되는 라이브러리 모듈로 구성됩니다.

자세한 정보

조건 유형

규칙 조건은 규칙 이벤트가 발생한 후 평가됩니다. 규칙이 계속 처리되려면 모든 조건이 true를 반환해야 합니다. 예외 사항은 사용자가 명시적으로 "예외" 버킷에 조건을 배치하는 경우로, 이때는 버킷 내의 모든 조건이 처리를 계속하기 위해서는 false를 반환해야 합니다.

예를 들어, 확장은 Platform Launch 사용자가 CSS 선택기를 지정할 수 있는 "뷰포트 포함" 조건 유형을 제공할 수 있습니다. 조건이 클라이언트의 웹 사이트에서 평가되면, 확장은 CSS 선택기와 일치하는 요소를 찾아 해당 조건이 사용자의 뷰포트 내에 포함되어 있는지 여부를 반환할 수 있습니다.

일반적으로 조건 유형은 (1) 사용자가 조건에 대한 설정을 수정할 수 있도록 하는 Platform Launch 애플리케이션 내에 표시되는 보기와 (2) Platform Launch 런타임 라이브러리 내에 제공되는 라이브러리 모듈에서 설정을 해석하고 조건을 평가하는 것으로 구성됩니다.

자세한 정보

작업 유형

규칙 작업은 규칙 이벤트가 발생하고 조건이 평가를 통과한 후에 수행되는 작업입니다.

예를 들어, 확장에서는 체크아웃 중에 어려움을 겪는 사용자를 돕기 위해 지원 채팅 대화 상자를 표시할 수 있는 "지원 채팅 표시" 작업 유형을 제공할 수 있습니다.

일반적으로 작업 유형은 (1) 사용자가 작업의 설정을 수정할 수 있는 Platform Launch 애플리케이션 내의 보기와 (2) 설정을 해석하고 작업을 수행하는, Platform Launch 런타임 라이브러리 내에 제공되는 라이브러리 모듈로 구성됩니다.

자세한 정보

데이터 요소 유형

데이터 요소는 데이터가 쿼리 문자열 매개 변수, 쿠키, DOM 요소 또는 기타 위치에 있는지의 여부와 관계없이 페이지의 데이터 조각을 나타내는 별칭입니다. 데이터 요소는 규칙에서 참조하고 이러한 데이터 조각에 액세스하기 위해 추상적으로 사용할 수 있습니다. 향후에 데이터 위치가 변경되면(예: DOM 요소의 innerHTML에서 JavaScript 변수 값으로), 단일 데이터 요소를 재구성할 수 있으며 해당 데이터 요소를 참조하는 모든 규칙은 변경되지 않습니다.

데이터 요소 유형을 사용하면 사용자가 특정 방식으로 데이터 조각에 액세스하도록 데이터 요소를 구성할 수 있습니다. 예를 들어, 확장은 Platform Launch 사용자가 로컬 저장소 항목 이름을 지정할 수 있는 "로컬 저장소 항목" 데이터 요소 유형을 제공할 수 있습니다. 데이터 요소가 규칙에 의해 참조되면 확장은 데이터 요소를 구성할 때 사용자가 제공한 로컬 저장소 항목 이름을 사용하여 로컬 저장소 항목 값을 조회할 수 있습니다.

일반적으로 데이터 요소 유형은 (1) 사용자가 데이터 요소의 설정을 수정할 수 있는 Platform Launch 애플리케이션 내에 표시되는 보기와 (2) 설정을 해석하고 데이터 조각을 검색하는, Platform Launch 런타임 라이브러리 내에 제공되는 라이브러리 모듈로 구성됩니다.

자세한 정보

공유 모듈

공유 모듈은 다른 확장이 액세스할 수 있도록 노출되는 모듈입니다. 이 방법은 확장 간에 통신하는 데 매우 유용한 메커니즘이 될 수 있습니다. 예를 들어, 확장 A는 데이터를 비동기식으로 로드하여 확장 B에서 약속을 통해 사용할 수 있도록 할 수 있습니다.

공유 모듈은 다른 확장 내에서 호출되지 않는 경우에도 라이브러리에 포함됩니다. 라이브러리 크기를 불필요하게 증가시키지 않으려면 공유 모듈로 노출된 항목에 주의해야 합니다.

공유 모듈에는 보기 구성 요소가 없습니다.

자세한 정보

Edge 확장 의 모듈

Edge 확장에서 규칙은 조건 검사를 통해 트리거되며 이러한 검사에 통과할 경우 특정 작업을 실행합니다. 자세한 내용은 Edge 확장의 모듈 흐름에 대한 개요를 참조하십시오.

Edge 확장에서 고유한 라이브러리 모듈을 정의할 수 있습니다. 이는 다음과 같은 유형으로 분류할 수 있습니다.

노트

Edge 확장에서 라이브러리 모듈을 구현하는 데 필요한 형식에 대한 자세한 내용은 모듈 형식 개요를 참조하십시오.

조건 유형

규칙 조건은 규칙 이벤트가 발생한 후 평가됩니다. 규칙이 계속 처리되려면 모든 조건이 true를 반환해야 합니다. 예외 사항은 사용자가 명시적으로 "예외" 버킷에 조건을 배치하는 경우로, 이때는 버킷 내의 모든 조건이 처리를 계속하기 위해서는 false를 반환해야 합니다.

예를 들어, 확장은 Platform Launch 사용자가 CSS 선택기를 지정할 수 있는 "뷰포트 포함" 조건 유형을 제공할 수 있습니다. 조건이 클라이언트의 웹 사이트에서 평가되면, 확장은 CSS 선택기와 일치하는 요소를 찾아 해당 조건이 사용자의 뷰포트 내에 포함되어 있는지 여부를 반환할 수 있습니다.

일반적으로 조건 유형은 (1) 사용자가 조건에 대한 설정을 수정할 수 있도록 하는 Platform Launch 애플리케이션 내에 표시되는 보기와 (2) Platform Launch 런타임 라이브러리 내에 제공되는 라이브러리 모듈에서 설정을 해석하고 조건을 평가하는 것으로 구성됩니다.

자세한 정보

작업 유형

규칙 작업은 규칙 조건이 평가를 통과한 후에 수행되는 작업입니다.

예를 들어, 확장에서는 체크아웃 중에 어려움을 겪는 사용자를 돕기 위해 지원 채팅 대화 상자를 표시할 수 있는 "지원 채팅 표시" 작업 유형을 제공할 수 있습니다.

일반적으로 작업 유형은 (1) 사용자가 작업의 설정을 수정할 수 있는 Platform Launch 애플리케이션 내의 보기와 (2) 설정을 해석하고 작업을 수행하는, Platform Launch 런타임 라이브러리 내에 제공되는 라이브러리 모듈로 구성됩니다.

자세한 정보

데이터 요소 유형

데이터 요소는 서버에서 받은 이벤트 내에서 데이터가 발견되는 위치와 관계없이 페이지의 데이터 조각에 대한 별칭입니다. 데이터 요소는 규칙에서 참조하고 이러한 데이터 조각에 액세스하기 위해 추상적으로 사용할 수 있습니다. 향후에 데이터 위치가 변경되면(예: 값이 포함된 이벤트 키 변경), 단일 데이터 요소를 재구성할 수 있으며 해당 데이터 요소를 참조하는 모든 규칙은 변경되지 않습니다.

일반적으로 데이터 요소 유형은 (1) 사용자가 데이터 요소의 설정을 수정할 수 있는 Platform Launch 애플리케이션 내에 표시되는 보기와 (2) 설정을 해석하고 데이터 조각을 검색하는, Platform Launch 런타임 라이브러리 내에 제공되는 라이브러리 모듈로 구성됩니다.

자세한 정보

확장 구성

확장 구성은 사용자로부터 전역 설정을 수집하는 방식을 나타냅니다. 예를 들어, 사용자가 비콘 전송 작업을 사용하여 비콘을 전송할 수 있도록 해주는 확장을 생각해보면 비콘에는 항상 계정 ID가 포함되어야 합니다. 비콘 전송 작업을 구성할 때마다 계정 ID를 요청하여 사용자에게 문제를 유발하는 것은 바람직하지 않습니다. 대신, 확장 구성 보기에서 계정 ID를 한 번 요청해야 합니다. 비콘이 전송될 때마다 비콘 전송 작업 라이브러리 모듈은 확장 구성에서 계정 ID를 가져와 비콘에 추가할 수 있습니다.

사용자가 Platform Launch 속성에 확장을 설치하면 확장 구성 보기가 표시됩니다. 확장 구성을 완료하지 않으면 확장의 설치를 완료할 수 없습니다.

확장 구성은 보기 구성 요소로 구성되며, 이 구성 요소는 Platform Launch 런타임 라이브러리 내에서 일반 객체로 내보내집니다.

자세한 정보

확장 구조

확장은 파일 디렉터리로 구성됩니다. 이러한 파일을 구조화하는 방법에 대한 개요는 다음과 같습니다. 파일 컨텐츠에 대한 자세한 정보는 다른 섹션에서 제공됩니다.

디렉터리 루트에 extension.json 파일이 있어야 합니다. 이 파일은 확장의 구성과 특정 파일이 디렉터리 내에 있는 위치를 설명합니다. 이는 npmpackage.json 파일과 일부 유사합니다.

각 라이브러리 모듈(Platform Launch 런타임 라이브러리 내에서 내보내는 논리)은 컨텐츠가 CommonJS 모듈 표준을 따르는 자체 파일이어야 합니다. 예를 들어 "비콘 보내기" 작업 유형을 작성하는 경우, 비콘을 보내는 논리를 포함하는 파일이 있어야 합니다. 이 파일의 내용은 Platform Launch 런타임 라이브러리 내에서 내보내집니다. 이를 sendBeacon.js라고 부릅니다. extension.json이 파일의 위치를 설명하므로 디렉터리에서 파일의 위치는 중요하지 않습니다.

각 보기는 Platform Launch 애플리케이션 내의 iframe에 로드할 수 있는 HTML 파일이어야 합니다. 보기에는 Platform Launch에서 제공하는 스크립트가 포함되어야 하며, 애플리케이션과 통신하기 위해 작은 API를 따라야 합니다. 보기 내에서 사용되는 라이브러리에 대해서는 제한이 없습니다. 즉, jQuery, Underscore, React, Angular, Bootstrap 또는 기타 라이브러리를 사용할 수 있습니다. 그러나 확장은 애플리케이션과 비슷한 모양과 느낌을 갖는 것이 좋습니다.

모든 보기 관련 파일(HTML, CSS, JavaScript)을 라이브러리 모듈 파일과 분리된 단일 하위 디렉터리에 배치하는 것이 좋습니다. extension.json은 이 보기의 하위 디렉터리가 있는 위치를 설명합니다. 그런 다음 Launch는 웹 서버에서 이 하위 디렉터리(및 이 하위 디렉터리만)를 처리합니다.

이 페이지에서는

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free