본문 바로가기
WIKI 기술 지식 베이스

How to use UBI JavaScript collector

원문 보기 위키 갱신

출처: 문서

본문

UBI JavaScript 수집기 사용 방법

UBI는 특정 검색에 대한 query_id의 생명 주기를 관리하고 UBI 이벤트 데이터 구조를 생성하여 특정 작업에 저장할 수 있는 매우 기본적인 JavaScript 클라이언트를 제공합니다.

스키마에 대한 자세한 내용은 UBI 인덱스 스키마를 참조하세요.

클라이언트를 특정 요구 사항을 해결하기 위한 시작점으로 사용하는 것을 권장합니다.

설치

클라이언트는 단일 파일(ubi.js)이며 axios 라이브러리에만 의존합니다.

다음에서 다운로드하세요: https://github.com/opensearch-project/user-behavior-insights/tree/main/ubi-javascript-collector/ubi.js.

이벤트를 참조하고 클라이언트를 생성하려면 다음 코드를 사용하세요:

import { UbiEvent } from './ubi';
import { UbiEventAttributes } from './ubi'
import { UbiClient } from './ubi'

const ubiClient = new  UbiClient('http://localhost:9200');

{% include copy.html %}

이벤트 생성

다음 코드는 전자상거래 애플리케이션에서 장바구니에 항목을 추가하는 것을 추적합니다. UbiEvent 및 UbiEventAttributes 클래스를 사용하여 이벤트 세부 정보를 캡슐화한 후 추적 시스템으로 보낼 수 있습니다.

var event = new UbiEvent(
    'add_to_cart', 
    client_id, 
    session_id, 
    getQueryId(), 
    new UbiEventAttributes('product', item.primary_ean, item.title, item), 
    item.title + ' (' + item.id + ')'
);

{% include copy.html %}

매개변수

  1. 이벤트 이름:

    • 'add_to_cart' -- 이 문자열은 추적 중인 이벤트 유형을 나타냅니다.
  2. 클라이언트 ID:

    • client_id -- 클라이언트의 고유 식별자를 보유하는 변수입니다. 이는 다른 사용자나 세션을 구별하는 데 도움이 됩니다.
  3. 세션 ID:

    • session_id -- 사용자 세션의 고유 식별자를 포함하는 변수입니다. 특정 세션 내에서 사용자 상호 작용을 추적하는 데 사용됩니다.
  4. 쿼리 ID:

    • getQueryId() -- 현재 쿼리 ID를 검색하는 함수 호출로, 특정 검색 또는 상호 작용 컨텍스트를 나타낼 수 있습니다.
  5. UbiEventAttributes:

    • 이는 UbiEventAttributes 클래스의 인스턴스로, 이벤트에 대한 추가 세부 정보를 캡슐화합니다:
      • 유형:
        • 'product' -- 속성 유형이 제품과 관련되어 있음을 지정합니다.
      • 기본 EAN:
        • item.primary_ean -- EAN 형식의 제품 고유 식별자입니다.
      • 제목:
        • item.title -- 제품의 이름 또는 설명입니다.
      • 항목:
        • item -- 모든 관련 세부 정보를 포함하는 완전한 제품 객체입니다.
  6. 이벤트 레이블:

    • item.title + ' (' + item.id + ')' -- 제품 제목과 고유 식별자(ID)를 포함하는 이벤트에 대한 설명 레이블을 생성합니다.

getQueryId() 메서드는 고유한 쿼리 ID를 생성하여 세션에 저장하는 도우미 메서드를 나타냅니다.
다음은 샘플 메서드입니다:

function generateQueryId(){
  const query_id = generateGuid();
  sessionStorage.setItem('query_id', query_id);
  return query_id;
}

function generateGuid() {
  let id = '';
  try{
    id = crypto.randomUUID();
  }
  catch(error){
    // crypto.randomUUID only works in https, not http context, so fallback.
    id ='10000000-1000-4000-8000-100000000000'.replace(/[018]/g, c =>
      (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
    );
  }
  return id;
};

{% include copy.html %}

이벤트 추적

trackEvent 메서드를 호출하여 이벤트를 백엔드로 보낼 수 있습니다:

ubiClient.trackEvent(event);

쿼리 추적

선택적으로 클라이언트를 사용하여 쿼리를 추적할 수 있습니다(OpenSearch용 UBI 플러그인 대신).

코드는 이벤트 추적에 사용되는 것과 유사합니다:

const query = new UbiQuery(APPLICATION, client_id, query_id, value, "_id", {});
ubiClient.trackQuery(query)

더 알아보기 (Learn more)