logoDokumentation
Suchen

Web-SDK-Integrationsleitfaden

Kompatibilität

Element Beschreibung
Kompatibilität IE9+, Chrome, Firefox, Safari, Opera, gängige mobile Browser, eingebettetes WebView auf iOS und Android

Verifizierungsformen

["slide","icon","nine","match"]
              
              ["slide","icon","nine","match"]

            
Diesen Codeblock im schwebenden Fenster anzeigen

Derzeit unterstützte Formen:

Name Beschreibung
slide Schiebepuzzle
icon Sequenzielles Anklicken von Symbolen
nine Neun-Felder-Raster
match Drei-Gewinnt-Spiel

Schnellstart

Importieren

gt4.js-Datei

Bereitgestellt von EngageLab

Das Importieren von gt4.js bindet die Initialisierungsfunktion initGeetest global ein.

<script src="https://captcha-stat.engagelab.com/www/gt4.js"></script>
              
              <script src="https://captcha-stat.engagelab.com/www/gt4.js"></script>

            
Diesen Codeblock im schwebenden Fenster anzeigen

Captcha initialisieren

💡 Tipp

Vor der Initialisierung müssen Sie eine Verifizierungs-ID vom Server abrufen. Details finden Sie unter Konfigurationsparameter.

Mit der Funktion initGeetest erhalten Sie die Captcha-Instanz. Der erste Parameter dieser Funktion sind die Konfigurationsparameter für das Captcha, der zweite Parameter ist die Callback-Funktion nach Abschluss der Initialisierung.

var config = { captchaId: 'xxxx', // Verifizierungs-ID apiServers: ['https://captcha-api.engagelab.com'], // Liste der Verifizierungsserver-Adressen, muss entsprechend konfiguriert werden staticServers: ['https://captcha-stat.engagelab.com/www/js'] // Liste der Adressen für statische Ressourcen, muss entsprechend konfiguriert werden } /** * @desc Callback nach abgeschlossener Initialisierung * @param { Object } gt Captcha-Instanz */ var callback = function(gt) { // Führen Sie geschäftsbezogene Aktionen basierend auf der Captcha-Instanz aus, z. B. das Auslösen des Captcha-Fensters, das Lauschen auf erfolgreiche Verifizierungsereignisse usw. } initGeetest(config, callback)
              
              var config = {
    captchaId: 'xxxx', // Verifizierungs-ID
    apiServers: ['https://captcha-api.engagelab.com'], // Liste der Verifizierungsserver-Adressen, muss entsprechend konfiguriert werden
    staticServers: ['https://captcha-stat.engagelab.com/www/js'] // Liste der Adressen für statische Ressourcen, muss entsprechend konfiguriert werden
}
/**
 * @desc Callback nach abgeschlossener Initialisierung
 * @param { Object } gt Captcha-Instanz
 */
var callback = function(gt) {
  // Führen Sie geschäftsbezogene Aktionen basierend auf der Captcha-Instanz aus, z. B. das Auslösen des Captcha-Fensters, das Lauschen auf erfolgreiche Verifizierungsereignisse usw.
}
initGeetest(config, callback)

            
Diesen Codeblock im schwebenden Fenster anzeigen

Captcha-Fenster auslösen

💡 Tipp

In Kombination mit dem Konfigurationsparameter product gibt es zwei Möglichkeiten, das Captcha-Fenster auszulösen:

  • Durch Klicken auf die bereitgestellte Schaltfläche. (product-Wert ist nicht bind)
  • Durch Aufruf der showCaptcha-Methode der Captcha-Instanz. (product-Wert ist bind)
<div id="captch_wrap" class="captch-wrap"></div> var config = { captchaId: 'xxxx', // Verifizierungs-ID apiServers: ['https://captcha-api.engagelab.com'], // Liste der Verifizierungsserver-Adressen, muss entsprechend konfiguriert werden staticServers: ['https://captcha-stat.engagelab.com/www/js'], // Liste der Adressen für statische Ressourcen, muss entsprechend konfiguriert werden product: 'bind' // Szenario 2 } /** * @desc Callback nach abgeschlossener Initialisierung * @param { Object } gt Captcha-Instanz */ var callback = function(gt) { gt.onReady(function() { // Szenario 1: Verwenden Sie die von EngageLab bereitgestellte Schaltfläche, um das Captcha-Fenster auszulösen // Die Schaltfläche im angegebenen Bereich einfügen gt.appendTo("#captch_wrap") // Szenario 2: Benutzerdefiniertes Auslösen des Captcha-Fensters // Rufen Sie die showCaptcha-Methode der Instanz bei einem bestimmten Ereignis auf // Zum Beispiel direkt nach dem Laden des Captchas gt.showCaptcha() }) } initGeetest(config, callback)
              
              <div id="captch_wrap" class="captch-wrap"></div>
var config = {
    captchaId: 'xxxx', // Verifizierungs-ID
    apiServers: ['https://captcha-api.engagelab.com'], // Liste der Verifizierungsserver-Adressen, muss entsprechend konfiguriert werden
    staticServers: ['https://captcha-stat.engagelab.com/www/js'], // Liste der Adressen für statische Ressourcen, muss entsprechend konfiguriert werden
    product: 'bind' // Szenario 2
}
/**
 * @desc Callback nach abgeschlossener Initialisierung
 * @param { Object } gt Captcha-Instanz
 */
var callback = function(gt) {
    gt.onReady(function() {
      // Szenario 1: Verwenden Sie die von EngageLab bereitgestellte Schaltfläche, um das Captcha-Fenster auszulösen
      // Die Schaltfläche im angegebenen Bereich einfügen
      gt.appendTo("#captch_wrap")
      // Szenario 2: Benutzerdefiniertes Auslösen des Captcha-Fensters
      // Rufen Sie die showCaptcha-Methode der Instanz bei einem bestimmten Ereignis auf
      // Zum Beispiel direkt nach dem Laden des Captchas
      gt.showCaptcha()
    })
}
initGeetest(config, callback)

            
Diesen Codeblock im schwebenden Fenster anzeigen

Verifizierungsergebnis abrufen

/** * @desc Callback nach abgeschlossener Initialisierung * @param { Object } gt Captcha-Instanz */ var callback = function(gt) { // Captcha-Fenster auslösen... // Auf Verifizierungsergebnisse lauschen gt.onSuccess(function(res) { console.log(res) }) } initGeetest({...}, callback)
              
              /**
 * @desc Callback nach abgeschlossener Initialisierung
 * @param { Object } gt Captcha-Instanz
 */
var callback = function(gt) {
    // Captcha-Fenster auslösen...
    // Auf Verifizierungsergebnisse lauschen
    gt.onSuccess(function(res) {
        console.log(res)
    })
}
initGeetest({...}, callback)

            
Diesen Codeblock im schwebenden Fenster anzeigen

Konfigurationsparameter

Konfigurationsparameter

Parameter Typ Beschreibung Standardwert
captchaId string Verifizierungs-ID, über das EngageLab-Backend erhalten Erforderlich
product string Captcha-Fenster-Anzeigemodus, mögliche Werte: float, popup, bind float
language string Priorität hat der übergebene Wert, gefolgt von der aktuellen Browsersprache. Wenn keine Übereinstimmung, wird der Standardwert verwendet zh
protocol string Netzwerkprotokoll //
apiServers array Adresse des Verifizierungsdienstes (ohne Protokoll), muss als ['https://captcha-api.engagelab.com'] konfiguriert werden -
staticServers array Adresse der für die Verifizierung benötigten statischen Ressourcen (ohne Protokoll), muss als ['https://captcha-stat.engagelab.com/www/js'] konfiguriert werden -
post boolean Bei true wird die Anfrage per Ajax gesendet, andernfalls per JSONP false
showSuccessTip boolean Steuert das Erfolgsbenachrichtigungsfenster, wenn product auf bind steht true
riskType string Gibt Verifizierungsformen wie Schieben, Klicken usw. an (nur wirksam, wenn der Verifizierungsmodus im Backend auf Risk Fusion steht) -
timeout number Timeout für Verifizierungsanfragen 30000
offlineCb function Benutzerdefinierte Offline-Handling-Funktion -
onError function Fehlerbehandlung vor der Captcha-Initialisierung -
mask Object Konfiguration der Maske für das Captcha-Fenster
nativeButton Object Konfiguration der integrierten Schaltfläche
toolbar Array Toolbar-Konfiguration
clientType string Client-Typ, möglicher Wert: web
width string Legt die Breite des Captcha-Fensters fest. Maximale Breite: 340px (Höhe ist adaptiv, Seitenverhältnis ca.) 340px
zoom number Skalierungswert für spezielle Szenarien, nicht durch den Maximalwert begrenzt (fester Wert 1 für Firefox) 1

Mask-Objekt-Konfiguration

Parameter Typ Beschreibung Standardwert
backgroundColor string Gültiger Farbwert -
outside boolean Captcha schließen beim Klicken außerhalb des Captcha-Bereichs -

NativeButton-Objekt-Konfiguration

Parameter Typ Beschreibung Standardwert
width string Breite der integrierten Auslöseschaltfläche -
height string Höhe der integrierten Auslöseschaltfläche -

Toolbar-Array-Konfiguration

initGeetest({..., toolbar: ['close', 'refresh']}, function() {...})
              
              initGeetest({..., toolbar: ['close', 'refresh']}, function() {...})

            
Diesen Codeblock im schwebenden Fenster anzeigen

Sprachkonfiguration

initGeetest({..., language: 'zh'}, function() {...})
              
              initGeetest({..., language: 'zh'}, function() {...})

            
Diesen Codeblock im schwebenden Fenster anzeigen
Gültiger Wert Typ Beschreibung
close string Schaltfläche zum Schließen des Captcha-Fensters
refresh string Schaltfläche zum Aktualisieren des Captcha-Fensters

Sprachen (18 Typen)

Möglicher Wert Sprache
ara Arabisch
deu Deutsch
eng Englisch
fra Französisch
ind Indonesisch
jpn Japanisch
kor Koreanisch
msa Malaiisch
pon Brasilianisches Portugiesisch
por Europäisches Portugiesisch
rus Russisch
spa Spanisch
tha Thailändisch
udm Uigurisch
vie Vietnamesisch
zh Vereinfachtes Chinesisch
zho-hk Traditionelles Chinesisch (Hongkong)
zho-tw Traditionelles Chinesisch (Taiwan)

Verhaltensverifizierung im Offline-Modus

Der Offline-Modus ist für Extremsituationen konzipiert, damit abnormale Captcha-Verifizierungsprozesse keine Auswirkungen auf die normalen Geschäftsprozesse haben.

Der Offline-Modus tritt hauptsächlich auf, wenn der Hauptserver der Website keine Verbindung zum Verifizierungsserver herstellen kann, was zu Verbindungsabbrüchen und anderen Problemen führt.

Im Offline-Modus werden alle Verifizierungsprozesse am Verifizierungsserver vorbei geleitet. Die Integrator:innen müssen eigene Verifizierungslogik hinzufügen oder einen Produkt-Downgrade-Plan vorsehen.

image

Wenn der Verifizierungsserver in den Offline-Modus wechselt,

bleibt der Client-Prozess unverändert und das Auslösen des Captchas führt sofort zum Erfolg und ruft onSuccess auf.

Das Geschäftssystem sendet eine sekundäre Verifizierung an das Captcha-System. Bei Timeout wird der Offline-Modus bestätigt.

initGeetest({...}, function(gt) { ... gt.onSuccess(function(res) { console.log(res) // Beispiel für ein erfolgreiches Verifizierungsergebnis { captcha_id: "59bbe0f128f0624fdd185a6a2207aa54", captcha_output: "X000Q5p.....i-SFRyH1", client_type: "web", gen_time: "1648204854", lot_number: "200e2e58e1d3a6906e08cc9ff5c6e0b5", offline: true, pass_token: "e000b4dc372c1397976f7b8f12d66ea8d5c993ab2db5810258e835429f6fa4ae" } // An das Geschäftssystem übermitteln... }) })
              
              initGeetest({...}, function(gt) {
    ...
    gt.onSuccess(function(res) {
        console.log(res) // Beispiel für ein erfolgreiches Verifizierungsergebnis
        {
            captcha_id: "59bbe0f128f0624fdd185a6a2207aa54",
            captcha_output: "X000Q5p.....i-SFRyH1",
            client_type: "web",
            gen_time: "1648204854",
            lot_number: "200e2e58e1d3a6906e08cc9ff5c6e0b5",
            offline: true,
            pass_token: "e000b4dc372c1397976f7b8f12d66ea8d5c993ab2db5810258e835429f6fa4ae"
        }
        // An das Geschäftssystem übermitteln...
    })
})

            
Diesen Codeblock im schwebenden Fenster anzeigen
icon
Vertrieb kontaktieren