Headless

PWA Studio 또는 React 또는 Vue JS와 같은 사용자 지정 프론트엔드 기술을 사용하여 Headless Storefront에서 Product Recommendations을(를) 통합할 수 있습니다.

사용자 정의 및 Headless 통합자는 이 Luma 및 PWA 지침을 권장 구현으로 참조해야 합니다. Product Recommendations을 Headless 솔루션에 구현하는 방법에는 여러 가지가 있으며 이 설명서에서는 모든 시나리오를 다루지 않습니다. 통합자는 해당 구현에 대한 이벤트, 설계 및 테스트를 다룹니다.

Product Recommendations을(를) 사용하려면 동작 및 카탈로그 데이터가 필요합니다. 카탈로그 데이터 동기화 프로세스는 Headless 구현에서 변경되지 않지만 동작 데이터 수집에는 변경이 필요합니다.

NOTE
Headless 인스턴스는 제품 Recommendations 대시보드를 구동하는 이벤트를 구현해야 합니다.

Headless 상점 앞에서 Product Recommendations을(를) 통합하려면 다음을 수행해야 합니다.

  1. 행동 데이터를 Adobe Sensei으로 전송하여 제품 추천 결과를 분석하고 계산합니다. 제품 추천 지표 보고을 사용하도록 설정하는 추가 데이터를 보낼 수도 있습니다.

  2. 제품 추천 결과를 가져오고 페이지에서 해당 결과를 렌더링합니다.

다음 워크플로에 설명된 대로 사용 가능한 SDK를 사용하여 이러한 작업을 모두 수행할 수 있습니다.

  1. Product Recommendations 모듈을 설치합니다.

  2. Adobe Commerce Storefront 이벤트 SDK를 설치하고 사용하여 동작 이벤트를 실행합니다.

    Product Recommendations개의 결과를 반환하는 데 필요한 최소 이벤트:

    table 0-row-2 1-row-2 2-row-2 3-row-2
    이벤트 범주
    view 제품
    add-to-cart 제품
    place-order 체크아웃

    지표 보고를 사용하려면 다음 추가 이벤트가 필요합니다.

    table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2
    이벤트 범주
    impression-render recommendation-unit
    view recommendation-unit
    rec-click recommendation-unit
    rec-add-to-cart-click 권장 사항 단위("장바구니에 추가" 단추가 권장 사항 템플릿에 있는 경우)
  3. 이벤트가 실행되면 Adobe Commerce 상점 이벤트 수집기를 사용하여 이벤트를 처리하고 Adobe Sensei으로 보내십시오.

  4. 동작 데이터가 수집되면 관리자에서 만들기 Product Recommendations할 수 있습니다.

  5. Recommendations SDK를 사용하여 상점 첫 화면에서 추천 단위를 가져옵니다. SDK는 페이지에서 추천 단위를 렌더링하는 데 필요한 제품 데이터를 반환합니다.

recommendation-more-help
4bf3c55a-3844-4322-a5d2-42b4e56228e5