JavaScript 연동

바닐라 JavaScript를 사용하여 모든 웹사이트에 SilentShield를 연동하거나, React, Vue, Angular용 프레임워크별 가이드를 사용하세요.

1. 스크립트 태그 추가

HTML에 다음 스크립트 태그를 추가합니다. 닫는 </body> 태그 앞에 넣는 것이 좋습니다:

<script src="https://api.silentshield.io/client.js?key=YOUR_API_KEY" defer></script>

2. 위젯 초기화

DOM이 로드된 후 SilentShield.init()을 호출합니다:

document.addEventListener('DOMContentLoaded', function() {
  SilentShield.init({
    apiKey: 'YOUR_API_KEY',
    lang: 'auto',
    features: {
      telemetry: true,
      captchaUI: true,
      fallbackCaptcha: true,
      showBrandingBadge: true,
    },
    onVerdict: function(response) {
      console.log('SilentShield verdict:', response);
    }
  });
});

설정 옵션

apiKey

API 키 (필수)

lang

언어 코드 또는 브라우저 자동 감지를 위한 'auto' (기본값: 'auto'). 25개 언어를 지원합니다.

thresholdSuspicious

이 점수 미만이면 챌린지가 트리거됩니다 (기본값: 0.6)

thresholdBlock

이 점수 미만이면 요청이 차단됩니다 (기본값: 0.3)

telemetry

행동 추적 활성화 (기본값: true)

captchaUI

필요 시 CAPTCHA UI 표시 (기본값: true)

fallbackCaptcha

수학 CAPTCHA 폴백 활성화 (기본값: true)

showBrandingBadge

'Protected by SilentShield' 배지 표시 (기본값: true)

zeroPii

Disable browser fingerprinting for maximum privacy (default: false). See Features → Zero-PII Mode.

debugOverlay

디버그 오버레이 표시 (기본값: false)

onVerdict

판정 결과를 수신할 때 호출되는 콜백 함수

Nonce 읽기

폼 제출 후 Nonce는 숨겨진 필드로 사용할 수 있습니다:

const nonce = document.querySelector('input[name="ss_nonce"]')?.value;