사용자 탐색

📘

JavaScript SDK 11.13.0 이상 버전에서만 지원합니다.

디버깅 용도로만 사용하는 것을 권장합니다.

사용자 식별자를 확인하고 A/B 테스트, 기능플래그에 강제할당 하는 방법을 설명합니다.

아래의 의존성을 추가합니다.

// [email protected] 이상일 경우
npm install @hackler/[email protected]

// [email protected] 미만일 경우
npm install @hackler/[email protected]
// [email protected] 이상일 경우
yarn add @hackler/[email protected]

// [email protected] 미만일 경우
yarn add @hackler/[email protected]
javascript-sdk 버전javascript-devtools 버전
11.13.0 <= version < 11.21.01.0.1
11.21.0 <= version1.0.2

사용자 탐색 설정

기능기본값지원
devTool사용자 탐색을 사용할 수 있도록 합니다.undefined11.13.0+
autoOpenDevTool사용자 탐색 버튼이 자동으로 나타나도록 하는 옵션입니다.false11.13.0+
  • devTool"@hackler/javascript-devtools" 에서 import한 HackleDevTools를 넣어주세요. (필수 )
  • autoOpenDevTooltrue로 설정할 경우 showUserExplorer을 호출하지 않아도 자동으로 사용자 탐색 창이 나타납니다. (기본 값은 false 입니다.)

기존 Hackle Client를 초기화하는 코드에 아래와 같이 옵션을 추가합니다.

import * as Hackle from "@hackler/javascript-sdk";
import HackleDevTools from "@hackler/javascript-devtools"

const config = {
  devTool: HackleDevTools,
  autoOpenDevTool: false,
};

// YOUR_BROWSER_SDK_KEY로 초기화
const hackleClient = Hackle.createInstance(YOUR_BROWSER_SDK_KEY, config);

// 사용자 탐색을 나타내고 싶은 시점에 Trigger 되도록 해주세요.
hackleClient.showUserExplorer()

// 사용자 탐색 창을 닫고 싶을 경우에 Trigger 되도록 해주세요.
hackleClient.hideUserExplorer()
<script src="https://fastly.jsdelivr.net/npm/@hackler/javascript-devtools@[1.0.1 혹은 1.0.2]/lib/index.browser.umd.min.js"></script>
<script>
  const config = {
    devTool: HackleDevTools.default,
  };

  // YOUR_BROWSER_SDK_KEY로 초기화
  const hackleClient = Hackle.createInstance(YOUR_BROWSER_SDK_KEY, config);

  // 사용자 탐색을 나타내고 싶은 시점에 Trigger 되도록 해주세요.
  hackleClient.showUserExplorer()

  // 사용자 탐색 창을 닫고 싶을 경우에 Trigger 되도록 해주세요.
  hackleClient.hideUserExplorer()

</script>

❗️

Production에서는 autoOpenDevTool 옵션을 false 로 설정하세요.

autoOpenDevTool을 true로 설정할 경우 자동으로 사용자 탐색 창이 나타납니다.

사용자 탐색 창을 나타내고 싶은 시점에 hackleClient.showUserExplorer을 호출하는 식으로 사용하시는 것을 권장합니다.

사용자 탐색 창

화면 하단에 핵클 로고 버튼이 표시됩니다. 버튼 클릭시 설정 화면으로 진입 할 수 있습니다.


사용자 식별자 확인하기

화면 상단에서 사용자 식별자를 확인 및 복사 할 수 있습니다.


사용자 강제할당

  • 화면하단에서 A/B 테스트, 기능플래그의 분배 결과를 확인할 수 있습니다.
  • SelectBox 클릭 시 특정 그룹으로 강제할당 할 수 있습니다.
  • Reset 버튼 클릭 시 강제할당이 해제됩니다.
  • Reset all 버튼 클릭시 모든 강제할당이 해제됩니다.
  • 브라우저에서 강제할당한 경우 해당 브라우저에서 분배하는 경우에만 적용됩니다. (대시보드 테스트기기에 등록되지 않습니다)
  • 강제할당이 적용되지 않는경우 브라우저를 새로고침 해주세요.