Configuration Parameters

The configuration parameters refer to the config object (key-value structure) passed during captcha initialization, which is the optional parameter configuration passed as the first parameter when calling the initialization function initGeetest4. For required parameters, please refer to the deployment documentation. For demo downloads, please visit the Geelab Console

Except for captchaId, all other parameters are optional (unless you know how to use them, do not set the following configuration parameters as they may have side effects in different scenarios):

Parameter	Required	Type	Description	Default	Options
captchaId	Y	string	Verification ID obtained from Geelab console
product	N	string	Display mode for next step verification	float	float, popup, bind
nativeButton	N	object	Geelab button style settings	`{ width:'260px', height:'50px' }`	Units can be px, %, em, rem, pt
rem	N	number	Set the overall scaling ratio of the captcha	1	Can pass different ratio values for different devices
language	N	string	Set the language of the verification interface text. If not passed, defaults to browser language. If not in supported list, defaults to Chinese	zho	zho, eng, zho-tw, zho-hk, udm, jpn, ind, kor, rus, ara, spa, pon, por, fra, deu
protocol	N	string	Protocol header	Defaults to current page protocol (must be set manually for local or hybrid development, otherwise it will usually get file protocol)	http://, https://
timeout	N	number	Set timeout for single request during verification	30000 (ms)	Integer greater than 0
hideBar	N	array	Hide close button and refresh button in subsequent verification interface	[]	['close','refresh']
mask	N	object	Popup related configuration, currently includes popup background color and whether to close verification when clicking outside captcha area	`{ outside:true, bgColor:'#0000004d' }`	`outside:false, bgColor: any valid CSS color unit`
apiServers	N	array	Control API request address. Please configure the corresponding dynamic domain based on the region you selected when registering your ID: Global `cap-global.geelabapi.com`, Europe `cap-eu.geelabapi.com`, North America `cap-na.geelabapi.com`	['cap-global.geelabapi.com']
nextWidth	N	string	Width of captcha popup (after setting this parameter, the captcha popup will not automatically adjust based on webpage content width)
riskType	N	string	Combined with risk control integration, specify verification form
hideSuccess	N	boolean	Hide verification success popup in bind display mode (Note: only effective when product parameter value is bind)	false	true
offlineCb	N	function	Offline mode handling function. Default is Geelab's offline mode. Setting this function means you want to customize offline logic (will not execute default offline mode)
onError	N	function	Error capture before captcha initialization
userInfo	N	string	Client information, such as user account, user phone number, username, etc.

`product`

In behavioral verification, most real users configured with AI mode only need to click once to pass verification. However, considering actual risk situations, requests judged as risky by behavioral verification will enter the next stage of verification. At this time, behavioral verification provides popup secondary verification interaction styles to facilitate users to be compatible with their own interface.

Currently provides three display modes

popup (Popup mode)
float (Float mode)
bind (Hidden button type)

For popup and bind types, you can set the following parameters in mask:

Parameter	Type	Function	Description
`bgColor`	string	Set popup background color	Defaults to black, can set any valid color value
Effects of each display mode are as follows.

popup, Popup mode:

initGeetest4({
    // Omit required configuration parameters

    product: 'popup'
}, function (captchaObj) {
    captchaObj.appendTo("#captchaBox"); //Insert verification button into captchaBox element in host page
    captchaObj.onReady(function(){
      //your code
    }).onSuccess(function(){
      //your code
    }).onError(function(){
      //your code
    })
})

float, Float mode:

initGeetest4({
    // Omit required configuration parameters

    product: 'float'
}, function (captchaObj) {
    captchaObj.appendTo("#captchaBox"); //Insert verification button into captchaBox element in host page
    captchaObj.onReady(function(){
      //your code
    }).onSuccess(function(){
      //your code
    }).onError(function(){
      //your code
    })
});

bind, Hidden button mode:

For bind type, note that the appendTo interface call will be invalid at this time. Call the showCaptcha instance method for verification.

initGeetest4({
    // Omit required configuration parameters

    product: 'bind'
}, function(captchaObj){
    captchaObj.onReady(function(){
        //Can only call showCaptcha method to display captcha after captcha is ready
    }).onSuccess(function(){
        //your code, reset captcha based on your business logic
        captchaObj.reset()
    }).onError(function(){
        //your code
    })
    // Button submit event
    button.click = function(){
        // some code
        // Check if captcha is ready, whether captcha's onReady has executed
        captchaObj.showCaptcha(); //Display captcha
        // some code
    }
});

`nativeButton`

Adjust the width of the verification button to fit the size of the host page.

Default: 260px * 50px.

Make button width consistent with input box by setting width height:

Example: Set button width and height to 100% to make button width consistent with its parent element width

initGeetest4({
    // Omit required configuration parameters
    nativeButton:{
      height: '100%',
      width: '100%'
    }
}, handler);

`language`

Set the language of verification interface text. Example languages are as follows. For more supported language configurations, contact Geelab assistant

zho (Simplified Chinese)
eng (English)
zho-tw (Taiwan)
zho-hk (Hong Kong)
udm (Uyghur)
jpn (Japanese)
ind (Indonesian)
kor (Korean)
rus (Russian)
ara (Arabic)
spa (Spanish)
pon (Brazilian Portuguese)
por (European Portuguese)
fra (French)
deu (German)

Set interface language to English

initGeetest4({
    // Omit required configuration parameters

    language: 'eng'
});

`protocol`

Set verification request header. Common ones are http://, https://. Default value is consistent with the protocol used by the host page.

initGeetest4({
    // Omit required configuration parameters

    protocol: "https://"
});

`timeout`

Set captcha single request loading timeout, default is 30000 milliseconds

initGeetest4({
    // Omit required configuration parameters

    timeout: 10000
});

`userInfo`

Pass client information, such as user account, user phone number, username, etc.

initGeetest4({
    // Omit required configuration parameters

    userInfo: "[email protected]"
});

Initialization

After initializing using the initialization function initGeetest4, its second parameter is a callback, and the first parameter of the callback is the verification instance, as shown in the code below.

initGeetest4({
    // Omit configuration parameters
}, function (captchaObj) {
    // Now you can call methods of verification instance captchaObj
});

Web API Methods

`appendTo(position)`

The appendTo method is used to insert the verification button into the host page to display it on the page. The accepted parameter can be an id selector (e.g. #captcha-box), or a DOM element object.

Can be passed in the following ways:

1.Pass id selector

    <div id="captcha-box"></div>
    ...
    <script>
        initGeetest4({
            // Omit configuration parameters
        }, function (captchaObj) {
            captchaObj.appendTo('#captcha-box');

            // Omit calls to other methods
        });
    </script>

2.Pass DOM element

    <div id="captcha-box"></div>
    ...
    <script>
        var captchaBox = document.getElementById('#captcha-box');
        initGeetest4({
            // Omit configuration parameters
        }, function (captchaObj) {
            captchaObj.appendTo(captchaBox);

            // Omit calls to other methods
        });
    </script>

`getValidate()`

Get the result obtained by the user after successful verification (onSuccess). This result is used for secondary verification by the server-side SDK. The getValidate method returns an object containing some fields needed for verification.

Returns false in other cases. Therefore, website developers can also decide whether to proceed with the next step (submit form or ajax for secondary verification) based on this return value.

Secondary verification via ajax

initGeetest4({
    // Omit configuration parameters
}, function (captchaObj) {
    // Omit calls to other methods

    // Here the onSuccess method is called, see below for method introduction
    captchaObj.onSuccess(function () {
        var result = captchaObj.getValidate();

        // ajax pseudocode
        $.ajax({
              url: 'Server side',
              data: result,
              dataType: 'json',
              success: function (res) {
                console.log(res.result);
            }
        })
    });
});

`reset()`

Return verification to initial state. Generally used when the backend finds verification successful but other information is incorrect (such as incorrect username and password), or when verification encounters an error. Therefore, this interface can only be called effectively when successful or when an error occurs. For bind mode, calling showCaptcha again after success will automatically reset, no need to actively call

Reset after finding incorrect username or password

initGeetest4({
    // Omit configuration parameters
}, function (captchaObj) {
    // Omit calls to other methods

    // Here the onSuccess method is called, see below for method introduction
    captchaObj.onSuccess(function () {
        var result = captchaObj.getValidate();

        // ajax pseudocode
        ajax('/login', {
            lot_number: result.lot_number,
            captcha_output: result.captcha_output,
            pass_token: result.pass_token,
            gen_time: result.gen_time,

            username: 'xxx',
            password: 'xxx'

            // Other data needed by server, such as username and password during login
        }, function (data) {
            // Perform jumps and other operations based on server secondary verification results
            if (data.status === 'fail') {
                alert('Incorrect username or password, please re-enter and complete verification');
                captchaObj.reset(); // Call this interface to reset
            }
        });
    });
});

`showCaptcha()`

When product is bind type, you can call this interface for verification.

The advantage of this form is that it allows developers to first check the data filled in by users, and then call the verification interface if there are no problems. But special attention should be paid to the timing of the call. Calling this method will have no response if the captcha has not entered the onReady state.

<div id="btn">Submit button</div>
<script>
initGeetest4({
    // Omit configuration parameters

    product: 'bind'
}, function (captchaObj) {
    // Omit calls to other methods

    document.getElementById('btn').addEventListener('click', function () {
        if (check()) { // Check if submission is possible
            captchaObj.showCaptcha();
        }
    });
    captchaObj.onSuccess(function () {
        // After user verification succeeds, perform actual submission behavior
        // todo
    })
});
</script>

`onReady(callback)`

Listen for verification button DOM generation completion event. Parameter callback is function type.

Hide "Loading verification prompt" based on onReady event

<div id="captcha-box">
    <div id="loading-tip">Loading, please wait...</div>
</div>
<script>
    initGeetest4({
        // Omit configuration parameters
    }, function (captchaObj) {
        captchaObj.appendto('#captcha-box');

        // Omit calls to other methods

        captchaObj.onReady(function () {
            // After DOM is ready, hide #loading-tip element
            // Just for example, hide in a way that suits you
            document.getElementById('loading-tip').style.display = 'none';
        });
    });
</script>

`onNextReady(callback)`

Listen for next step resource loading completion event. Parameter callback is function type.

<div id="captcha-box">
    <div id="loading-tip">Loading, please wait...</div>
</div>
<script>
    initGeetest4({
        // Omit configuration parameters
    }, function (captchaObj) {
        captchaObj.appendto('#captcha-box');

        // Omit calls to other methods

        captchaObj.onNextReady(function () {

        });
    });
</script>

`onSuccess(callback)`

Listen for verification success event. Parameter callback is function type.

Listen for verification success event, perform secondary verification

initGeetest4({
    // Omit configuration parameters
}, function (captchaObj) {
    // Omit calls to other methods

    captchaObj.onSuccess(function () {
        var result = captchaObj.getValidate();

        // ajax pseudocode, perform secondary verification
        ajax('/login', {
            lot_number: result.lot_number,
            captcha_output: result.captcha_output,
            pass_token: result.pass_token,
            gen_time: result.gen_time,

            // Other data needed by server, such as username and password during login
        }, function (data) {
            // Perform jumps and other operations based on server secondary verification results
        });
    });
});

`onFail(callback)`

Listen for verification success event. Parameter callback is function type. failObj operation failure object contains: captcha_id, captcha_type, challenge, may be added later. Listen for captcha operation failure event, count user operation failure times

initGeetest4({
    // Omit configuration parameters
}, function (captchaObj) {
    // Omit calls to other methods

    captchaObj.onFail(function (failObj) {
        //  Do some statistics on error information
    });
});

`onError(callback)`

Listen for verification error event. Parameter callback is function type. Static resource loading failure, poor network and other errors that captcha can capture (refer to ErrorCode) will trigger onError callback. This error object contains three parts: code: error code, msg: prompt message, desc: this object contains detail attribute, describes specific error information, may be added later

When error event triggers, you can prompt user to refresh page and retry.

initGeetest4({
    // Omit configuration parameters
}, function (captchaObj) {
    // Omit calls to other methods

    captchaObj.onError(function (error) {
        // Error occurred, can remind user to retry later
        // error contains error_code, msg
        // {code: '60000',msg:"User configuration error", desc:{ detail: "User id missing"} }
    });
});

`onClose(callback)`

When user closes the popped up verification, this callback will be triggered.

initGeetest4({
    // Omit configuration parameters

    product: 'bind'
}, function (captchaObj) {
    // Omit calls to other methods

    captchaObj.onClose(function () {
        // User closed verification, you can prompt user that verification needs to be passed before proceeding with subsequent processes
    });
});

`destroy`

Destroy verification instance. Verification related UI and verification registered event listeners will be removed.

initGeetest4({
    // Omit configuration parameters

    product: 'bind'
}, function (captchaObj) {
    // Omit calls to other methods

    captchaObj.onSuccess(function () {
        var result = captchaObj.getValidate();

        // ajax pseudocode
        ajax('/login', {
            lot_number: result.lot_number,
            captcha_output: result.captcha_output,
            pass_token: result.pass_token,
            gen_time: result.gen_time,

            username: 'xxx',
            password: 'xxx'

            // Other data needed by server, such as username and password during login
        }, function (data) {
            // Perform jumps and other operations based on server secondary verification results
            if (data.status === 'fail') {
                alert('Incorrect username or password, please re-enter and complete verification');
                captchaObj.reset(); // Call this interface to reset
            }else if(data.status === 'success'){
                // Based on business logic, determine if verification needs to be removed
                captchaObj.destroy();
                captchaObj = null;
            }
        });
    });
});

ErrorCode

Geelab behavioral verification Web side business error codes

ErrorCode	Description
60001	Configuration parameter captcha_id is incorrect: Please check the configuration parameter captcha_id (corresponding to ID when applying) passed during initialization
60002	Parameter passed to appendTo interface is incorrect, only accepts id selector and DOM element
60100	/load request error: 1. Please keep network smooth; 2. Check configuration parameter captchaId passed during initialization
60101	/verify request error: 1. Please keep network smooth; 2. Please contact Geelab customer service
60200	Skin loading failed: 1. Please keep network smooth; 2. Please contact Geelab customer service
60201	Language pack loading failed: 1. Please keep network smooth; 2. Please contact Geelab customer service
60202	Verification image loading failed: 1. Please keep network smooth; 2. Please contact Geelab customer service
60204	(gacptcha4) js resource loading timeout: 1. Please keep network smooth; 2. Please contact Geelab customer service
60205	(gct4) js resource loading timeout: 1. Please keep network smooth; 2. Please contact Geelab customer service
60500	Server forbidden: Please contact Geelab customer service

Web

On this page