목적

이 문서는 플랫폼(언어 및 프레임워크)에 관계없이 Sidetalk AI 채팅 서비스를 웹사이트에 연동하는 방법을 설명합니다

1. 기본 설치 (Client-Side)

웹사이트의 HTML 코드 내에 스크립트를 로드하고 초기화 함수를 호출합니다. 모든 페이지 또는 채팅 버튼이 노출될 페이지의 </head> 태그 혹은 상황에 따라서 </body> 태그 직전에 삽입하십시오.

1.1 스크립트 로드

<script src="<https://pages.sidetalk.ai/sidetalk.js>"></script>

1.2 초기화 코드

<script>
SidetalkAI('init', {
    siteKey: 'YOUR_SITE_KEY',  // [필수] 관리자 페이지에서 발급받은 Site Key
    buttonText: '문의하기',      // 버튼 텍스트
    buttonBottom: '20px',      // 하단 여백
    buttonRight: '20px',       // 우측 여백
    // userInfo: { ... }       // 로그인 사용자 정보 (아래 2번 항목 참조)
});
</script>

2. 회원 정보 연동 (User Info)

로그인한 사용자의 정보를 상담창에 자동 연동하기 위해 userInfo 객체를 설정합니다. 보안을 위해 서명(Signature) 값이 반드시 포함되어야 합니다.

2.1 userInfo 객체 구조

초기화 코드의 userInfo 속성에 할당할 데이터 구조입니다.

필드명 타입 필수 설명
signature String O 서버에서 생성된 보안 인증 토큰 (하단 생성 방법 참조)
member_id String O 회원 고유 ID (DB PK 등)
user_name String X 회원 이름
user_email String X 회원 이메일
user_phone String X 회원 전화번호

3. 서명(Signature) 생성 방법 (Server-Side)

signature는 클라이언트가 아닌 서버에서 생성해야 합니다. Sign Key가 브라우저에 노출되지 않도록 주의하십시오.

3.1 생성 알고리즘

  1. 준비 데이터: