홈으로

연동: 개발자를 위한 기술 참조

reactive.chat 연동의 전체 기술 참조: 브라우저(script 태그, JavaScript API, 이벤트, 신원, SPA, CSP)와 서버(서명, 고객 데이터, 웹훅, REST API, MCP, 채널, 자체 도메인).

이 참조는 reactive.chat을 웹사이트, 앱이나 백엔드에 연동하는 개발자를 위한 문서입니다. 코드에 구현된 인터페이스와 흐름을 이름, 유형, 기본값과 오류 사례와 함께 설명합니다.

외관, 텍스트, 시작 화면, 규칙, 투어, A/B 테스트와 AI 페르소나 설정은 사용자 지정에 설명되어 있습니다. 계정과 상담원 화면의 사용법은 매뉴얼에 있습니다.

한눈에 보기

Your visitors' browser                      reactive.chat                         your server
----------------------                      -------------                         -----------
loader.js  --(trigger)-->   core.<hash>.js  cdn.reactive.chat
   window.ReactiveChat (API, events)
   WebSocket rc.v1  <------------------->   ws.reactive.chat/rc_wss/
   HTTP fallback (SSE/Poll) <----------->   ws.reactive.chat/rc_wss/h/
                                            chat server  --- POST (signed) ---->  customer data endpoint
                                                         --- POST (signed) ---->  webhook receiver
                                            reactive.chat/v1  <--- Bearer -----  REST API / MCP
identify(userHash)  <-------------------------------------- HMAC-SHA256 ------  identity secret

클라이언트 측에서는 script 태그를 삽입하고 선택적으로 window.ReactiveChat으로 위젯을 제어합니다. 서버 측에서는 로그인 사용자의 신원에 서명하고 필요에 따라 고객 데이터 요청에 응답하며 웹훅을 받고 REST API를 사용합니다.

장별 안내

기본 사항

아키텍처와 흐름 – 구성 요소, 협력 방식, 버전과 배포
빠른 시작 – 삽입, 도메인 등록, CSP, 검사

브라우저

script 태그 참조 – 모든 data-rc-* 속성과 설정 출처
JavaScript API – ReactiveChat(…)의 모든 명령
이벤트 – on/off와 DOM 이벤트
방문자 식별과 맥락 전달 – identify, userHash, exp, track
단일 페이지 앱과 페이지 변경
보안과 Content Security Policy

연결과 배포

자체 도메인과 퍼스트 파티 프록시 – nginx, Apache, Caddy
전송: WebSocket, HTTP 대체 연결, 재연결 – 프로토콜, 오류와 종료 코드

서버

고객 데이터 엔드포인트 – 주문 조회와 가져오기
웹훅 – 이벤트, 서명, 재시도, REST 훅
서버 API(REST v1)와 MCP
연동과 채널 – WhatsApp, Messenger, Instagram, Telegram, SMS, 이메일

다른 연동 위치

모바일 앱 – WebView의 채팅
Smart Answer – 웹사이트 검색의 AI 답변

운영

용어

사이트 키 – 스니펫에 포함되는 프로젝트의 공개 키(24자)입니다. 비밀 정보가 아닙니다.
프로젝트 – 자체 설정이 있는 웹사이트나 앱입니다. 여러 프로젝트가 워크스페이스를 이룹니다.
상담원 화면 – 팀이 답변하는 화면입니다.
확인된 사용자 – 서버가 userHash로 신원에 서명한 방문자입니다.
로더 / 코어 – 작은 로딩 구성 요소 loader.js와 이후 로드되는 주요 구성 요소 core.<hash>.js입니다.

문서의 모든 부분을 한눈에 보기: 문서.

최종 업데이트: 2026-10-25

연동: 개발자를 위한 기술 참조

한눈에 보기

장별 안내

관련 추가 페이지

용어