홈으로

script 태그 참조: 모든 속성과 설정 출처

로더 태그의 data-rc 속성, window.ReactiveChatSettings와 ReactiveChat('boot')의 전체 참조입니다. 유형, 기본값, 우선순위와 페이지의 다른 요소에 쓰는 속성을 설명합니다.

위젯은 script 태그 속성만으로 완전히 설정할 수 있습니다. 인라인 스크립트가 필요 없어 엄격한 Content Security Policy에서도 가능합니다. JavaScript를 선호하면 window.ReactiveChatSettings 또는 ReactiveChat('boot', …)로 같은 필드를 설정합니다.

디자인, 텍스트, 시작 화면, 규칙과 투어는 일반적으로 계정에서 설정하며 연결할 때 서버에서 가져옵니다. 여기의 속성은 페이지별로 적용할 항목입니다. 모든 디자인 옵션은 사용자 지정에 설명되어 있습니다.

네 가지 설정 출처와 우선순위

나중 출처가 우선합니다. 병합은 얕은 병합입니다. brand 같은 객체 필드는 깊게 병합하지 않고 전체를 대체합니다.

위젯 기본값
로더 태그의 data-rc-* 속성
window.ReactiveChatSettings(로더 전에 설정)
큐의 ReactiveChat('boot', {...}) 호출 순서

위젯이 모르는 필드는 폐기하므로 오타가 있는 속성은 안내 없이 효과가 없습니다.

<script>
  window.ReactiveChatSettings = { locale: 'en', position: 'left' };
</script>
<script src="https://cdn.reactive.chat/loader.js"
        data-rc-site-key="SITE_KEY"
        async></script>

속성값을 읽는 방식

이름은 kebab case에서 camel case로 변환합니다. data-rc-site-key → siteKey. 유형은 기본값에서 결정합니다.

문자열 – 그대로 사용합니다.
불리언 – "false"와 "0"만 false이며 빈 속성을 포함한 나머지는 모두 true입니다.
목록 – 쉼표로 구분합니다. 예: "idle,pointer".
숫자 또는 객체 – JSON으로 읽습니다. 유효하지 않은 JSON이면 기본값을 유지합니다.

현재 실행 중인 태그만 읽습니다(document.currentScript). 따라서 type="module" 대신 일반 스크립트로 로더를 삽입합니다.

필수

data-rc-site-key(문자열, 필수) – 계정 프로젝트 → 설치의 프로젝트 키입니다. 패턴은 [A-Za-z0-9_-]{8,64}입니다. 없거나 유효하지 않으면 콘솔 안내 없이 아무것도 시작하지 않습니다.

연결과 배포

data-rc-ws-url(문자열, 선택 사항) – 채팅 연결 주소입니다. 없으면 loader.js 위치에서 도출합니다(cdn.reactive.chat → wss://ws.reactive.chat/rc_wss/). cdn.reactive.chat에서 loader.js를 로드하지 않거나 .co.uk 같은 두 부분 최상위 도메인에서는 필수입니다. 전송을 참조합니다.
data-rc-cdn-base(문자열, 선택 사항) – 코어와 모듈을 로드하는 디렉터리입니다. 기본값은 loader.js의 디렉터리입니다.
data-rc-core-url(문자열, 선택 사항) – 같은 디렉터리의 core.<hash>.js 대신 사용할 고정 코어 주소입니다. 자체 미러 같은 특수한 경우에만 사용합니다.
data-rc-transport(http, 선택 사항) – 시작부터 HTTP 대체 연결을 강제합니다. 시작 시 문서에 있는 모든 요소에서 작동하며 ReactiveChatSettings.transport = 'http'로도 설정할 수 있습니다. boot로는 효과가 없습니다.
data-rc-max-retries(숫자, 기본값 2) – 코어 로드 실패 시 재시도 횟수입니다(간격: 300 ms × 시도 횟수).

언어, 테마, 동작

data-rc-locale(문자열, 기본값 auto) – de, en, pl입니다. auto는 <html lang>, 그다음 브라우저 언어를 사용하고 그 외에는 영어입니다. 다른 언어는 영어로 대체됩니다.
data-rc-theme(auto | light | dark, 기본값 auto) – auto는 페이지의 라이트·다크 모드를 따르고 그 외에는 시스템을 따릅니다.
data-rc-motion(auto | reduced | full, 기본값 auto) – 애니메이션입니다. auto는 prefers-reduced-motion을 따릅니다.
data-rc-strings(JSON 객체, 기본값 {}) – 개별 텍스트를 덮어씁니다. 예: {"a11y.launcher":"Open help"}. 그 외에는 계정에서 텍스트를 관리합니다(사용자 지정).

표시와 위치

data-rc-position(right | left, 기본값 right) – 채팅 버튼과 창의 모서리입니다.
data-rc-offset(JSON, 기본값 {"x":20,"y":20}) – 안전 영역에 더하는 가장자리와의 거리이며 픽셀 단위입니다.
data-rc-z-index(숫자, 기본값 2147483000).
data-rc-avoid-overlap(불리언, 기본값 true) – 하단 가장자리의 고정 막대(쿠키 배너, 장바구니 막대)를 피합니다.
data-rc-hide-launcher(불리언, 기본값 false) – 채팅 아이콘이 없습니다. 창은 자체 링크 또는 JavaScript API로만 열립니다. 안내 말풍선도 표시하지 않습니다. 계정 설정과 무관하게 적용됩니다.
data-rc-auto-open(불리언, 기본값 false) – 시작 후 창을 엽니다.
data-rc-isolation(shadow | iframe, 기본값 shadow) – 위젯은 닫힌 shadow DOM에 있습니다. iframe은 전역 스타일의 영향이 매우 강한 페이지를 위해 창을 프레임에 렌더링합니다.
data-rc-brand(JSON 객체) – 브랜드 색상과 채팅 버튼 형태입니다. 로더는 primary(#rrggbb), onPrimary, radius, launcher.shape(circle, rounded, square, bubble, leaf), launcher.size(44–72), launcher.size_m을 즉시 읽고 나머지는 코어가 검사합니다. 계정의 스니펫에는 이미 이 값이 있습니다. 유효한 primary가 없으면 로더는 자리 표시자 버튼을 표시하지 않고 서버에서 색상을 받을 때까지 기다립니다(색상 변화는 없지만 버튼이 늦게 나타남). 객체에 이 초기 필드만 있으면 연결 후 계정의 브랜드 설정을 적용하고, accent 같은 추가 필드가 있으면 직접 지정한 설정을 적용합니다. 자세한 내용은 사용자 지정에 있습니다.
data-rc-logo(JSON 객체) – src, placement(launcher, header, both), height, alt입니다.
data-rc-custom-css(문자열) – shadow DOM 안의 자체 CSS입니다. 사용자 지정을 참조합니다.

로딩과 동작

data-rc-load-triggers(목록, 기본값은 다섯 개 모두) – 코어 로드 시점입니다. idle(브라우저 유휴), pointer(마우스나 손가락이 채팅 버튼 위에 있음), command(boot, update, track, identify 이외의 API 명령), frustration(MousePlayer 신호), push입니다. 첫 트리거를 적용합니다.
data-rc-idle-timeout-ms(숫자, 기본값 3000) – idle 트리거의 시간 제한입니다.
data-rc-consent(auto | granted | denied, 기본값 auto) – 동의 상태입니다. auto는 동의 플랫폼(__tcfapi를 통한 IAB TCF v2, 그 외에는 consented.eu)에 물으며 granted/denied는 값을 고정합니다. 개인정보 보호 연동을 참조합니다.
data-rc-dom-spiegel(불리언, 기본값 true) – false는 어시스턴트에 페이지 텍스트를 보내지 않으며 “보여 주세요”를 끕니다.
data-rc-promo(불리언, 기본값 true) – false는 이 페이지의 홍보 카드를 숨깁니다.
data-rc-launcher-selector(CSS 선택자) – 일치하는 요소를 클릭하면 창을 전환합니다. 코어 로드 후에만 작동합니다. 즉시 작동해야 하는 링크에는 아래의 data-rc-open을 사용합니다.
data-rc-dnd(불리언, 기본값 false) – “방해 금지”의 초기값입니다.
data-rc-session-ttl-ms(숫자, 기본값 1800000) – MousePlayer 세션을 이어받는 기간입니다.
data-rc-debug(불리언, 기본값 false) – 콘솔 진단 출력입니다. 브라우저의 localStorage.setItem('rc_debug', '1')과 같습니다.

페이지의 다른 요소에 쓰는 속성

채팅 열기(코어 로드 전에도 즉시 작동):

data-rc-open – 모든 요소에 사용할 수 있으며 클릭하면 요소 옆에 채팅이 열립니다. data-rc-open="corner"는 모서리에 엽니다.
href="#rc-open" 또는 href="#reactive-chat" – 링크용으로 같은 기능입니다.
data-rc-anchor="none" – corner와 같습니다.
data-rc-message – 입력란에 작성되지만 전송하지 않는 텍스트입니다(최대 200자).
data-rc-tab – msg, home, help: 앞에 표시할 탭입니다.

자세한 내용: 자체 링크나 버튼으로 채팅 열기.

개인정보 보호 안내:

data-rc-privacy – 개인정보 처리방침의 reactive.chat 절을 위한 자리 표시자입니다. data-lang, data-heading(2–6), data-email을 함께 사용합니다. 상태는 data-rc-privacy-state(loading, done, error)에 있습니다. 개인정보 보호 연동을 참조합니다.

페이지 텍스트 제외:

data-rc-private 또는 같은 기능의 data-rc-ignore – 이 하위 트리는 페이지 텍스트로 어시스턴트에게 전달되지 않으며 “보여 주세요”의 대상도 되지 않습니다.

<aside data-rc-private>
  Internal notes the assistant should not read.
</aside>

URL 매개변수

?rc_ab=A에서 E까지 – 품질 확인을 위해 실행 중인 A/B 테스트의 실험안을 강제합니다(사용자 지정 참조).

위젯은 로드 시 주소의 다른 매개변수를 평가하지 않습니다.

여러 번 삽입

로더가 페이지에 두 번 있으면(예: 템플릿과 태그 관리자) 유효한 사이트 키가 있는 첫 번째만 시작하고 두 번째는 아무것도 하지 않습니다. 첫 태그의 키가 유효하지 않아도 올바른 두 번째 태그를 막지 않습니다.

다음: JavaScript API · 이벤트

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