Vanilla JS SDK

1. 설치

npm i @h6s-ai/web

빌드 도구 없이 쓰려면 script tag로 로드합니다. 같은 API가 window.h6s 에 노출됩니다.

<script src="https://js.h6s.ai/sdk/v1/h6s.js"></script>

v1 경로는 보안 패치가 자동 전파됩니다 (5분 캐시). 특정 버전 고정이 필요하면 js.h6s.ai/sdk/v1.0.3/h6s.js 와 SRI hash 를 사용합니다.

2. 토큰 발급

sessionToken 은 파트너 백엔드가 API 키로 발급합니다. 브라우저에서는 만들지 않습니다. 발급 요청·응답 형식은 SDK 개요의 백엔드 단계에서 확인할 수 있습니다.

3. managed iframe 열기

h6s가 UI를 렌더하는 관리형 흐름은 @h6s-ai/web/managed 서브패스를 사용합니다. 토큰을 받아 전체화면 iframe 위젯을 엽니다. 등록이 끝나면 같은 콜백 계약으로 결과가 전달됩니다.

import { openRegistration } from "@h6s-ai/web/managed";

const handle = openRegistration({
  sessionToken,                              // 백엔드에서 발급받은 1회용 토큰
  onSuccess: ({ sessionId }) => {
    // 등록 완료 후 세션 상태를 갱신합니다
    location.href = "/done?session=" + sessionId;
  },
  onExit: ({ reason }) => {
    // reason 별 처리 (아래 표 참고)
  },
});

// 필요하면 직접 닫을 수 있습니다
// handle.close();

script tag로 로드했다면 같은 호출을 window.h6s 로 합니다.

<script src="https://js.h6s.ai/sdk/v1/h6s.js"></script>
<button id="register">자격증명 등록</button>
<script>
  document.getElementById("register").onclick = () => {
    window.h6s.openRegistration({
      sessionToken: window.SESSION_TOKEN,   // 서버 렌더 시 주입
      onSuccess: ({ sessionId }) => console.log("done", sessionId),
    });
  };
</script>

4. 이벤트 처리

onSuccess 의 sessionId 로 등록 완료 상태를 갱신할 수 있습니다. onExit 은 reason 으로 종료 사유를 구분합니다. 두 콜백은 동시에 발생하지 않습니다.