SilentShield

Integracja JavaScript

SilentShield można zintegrować z dowolną witryną za pomocą czystego JavaScript lub skorzystać z naszych dedykowanych przewodników dla React, Vue i Angular.

1. Dodanie tagu skryptu

Ten tag skryptu należy dodać do swojego kodu HTML, najlepiej przed zamykającym tagiem </body>:

HTMLhtml
<script src="https://api.silentshield.io/client.js?k=YOUR_API_KEY" crossorigin="anonymous" defer></script>

2. Inicjalizacja widgetu

Ręczna inicjalizacja nie jest potrzebna — client.js inicjalizuje się sam i pobiera konfigurację widżetu (motyw, język, odznakę) z ustawień panelu:

JavaScriptjavascript
// No init call needed — client.js bootstraps itself as soon as it loads
// and pulls your widget configuration (theme, language, badge) from the
// dashboard: App → API keys → [your key] → Widget.

Opcje konfiguracji

apiKey
Klucz API (wymagany)
lang
Kod języka lub 'auto' dla automatycznego wykrywania przeglądarki (domyślnie: 'auto'). Obsługuje 25 języków.
thresholdSuspicious
Wynik poniżej tego progu uruchamia wyzwanie (domyślnie: 0.6)
thresholdBlock
Wynik poniżej tego progu blokuje żądanie (domyślnie: 0.3)
telemetry
Włącza śledzenie zachowań (domyślnie: true)
captchaUI
Wyświetla interfejs CAPTCHA w razie potrzeby (domyślnie: true)
fallbackCaptcha
Włącza matematyczną CAPTCHA jako rozwiązanie awaryjne (domyślnie: true)
showBrandingBadge
Wyświetla znaczek „Chronione przez SilentShield" (domyślnie: true)
zeroPii
Wyłącza fingerprinting przeglądarki dla maksymalnej prywatności (domyślnie: false). Zob. Funkcje → Tryb Zero-PII.
debugOverlay
Wyświetla nakładkę debugowania (domyślnie: false)
onVerdict
Funkcja zwrotna wywoływana po otrzymaniu werdyktu

Aplikacje jednostronicowe (SPA)

W przypadku SPA z routingiem po stronie klienta (React Router, Vue Router itp.) SilentShield automatycznie obserwuje zmiany w DOM i wykrywa nowe formularze. Po nawigacji nie jest wymagana ponowna inicjalizacja.

Odczytywanie nonce

Po przesłaniu formularza nonce jest dostępny jako ukryte pole:

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