@h6s-ai/react

React 애플리케이션에서 자격증명 등록을 처리하는 컴포넌트와 hook입니다. @h6s-ai/web 위에 얹은 래퍼이며, managed 전체화면 iframe을 React 앱에서 열 수 있게 합니다.

설치

npm i @h6s-ai/react

빠른 시작

import { RegistrationButton } from "@h6s-ai/react/managed";

export function RegisterCredential({ sessionToken }: { sessionToken: string }) {
  return (
    <RegistrationButton
      sessionToken={sessionToken}
      onSuccess={({ sessionId, connectionId }) => {
        // 등록 완료 후 세션 상태를 갱신합니다
      }}
      onExit={({ reason }) => {
        // reason 별 후속 처리를 합니다
      }}
    >
      자격증명 등록
    </RegistrationButton>
  );
}

RegistrationButton 은 클릭 시 managed 전체화면 iframe을 열고, 등록이 끝나면 콜백으로 결과를 돌려줍니다. 인증서와 기관 로그인 입력값은 end-user 브라우저에서 처리되며 파트너 서버를 거치지 않습니다.

공동인증서 에이전트 설치 URL

import { getCertificateAgentDownloadUrl } from "@h6s-ai/react";

const href = getCertificateAgentDownloadUrl();
const macHref = getCertificateAgentDownloadUrl({ platform: "macos" });

현재 브라우저의 플랫폼을 자동 감지합니다. 모바일·서버 환경처럼 설치 파일이 없는 경우에는 null 을 반환합니다.

managed 컴포넌트와 hook

managed 등록 화면은 @h6s-ai/react/managed 서브패스로 가져옵니다.

import { RegistrationButton } from "@h6s-ai/react/managed";

<RegistrationButton sessionToken={sessionToken} onSuccess={({ sessionId }) => {}}>
  자격증명 등록
</RegistrationButton>;

• 직접 만든 트리거에서 열기 (useRegistration)
• 기본 버튼 컴포넌트로 열기 (<RegistrationButton>)

sessionToken 은 백엔드에서

sessionToken 은 브라우저에서 만들지 않습니다. 파트너 백엔드가 API 키로 발급한 1회용 토큰을 받아 컴포넌트/hook에 전달합니다. 발급 호출과 옵션은 SDK 가이드에 정리되어 있습니다.