Search...
reset( )
Resets the reCAPTCHA element.
Description
reset()
the reCAPTCHA element in the following cases:
- CAPTCHA fails authorization
- The operation restricted by the reCAPTCHA element is successfully completed. This enables the reCAPTCHA element for the next operation.
Syntax
function reset(): Promise<void>
reset Parameters
This function does not take any parameters.
Returns
Fulfilled - When the reCAPTCHA element has been reset.
Return Type:
Promise<void>
Was this helpful?
Reset the reCAPTCHA element
Copy Code
1$w("#myCaptcha").reset();
Full CAPTCHA lifecycle scenario
This example demonstrates how to use reCAPTCHA to protect a data insertion. We use a text input for the data, a reCAPTCHA element, and a submit button. The submit button is disabled until the CAPTCHA is verified and a token is generated. Clicking the submit button triggers backend authorization of the token. If authorization is successful, the data is inserted into the collection.
Copy Code
1/************************************2 * backend code - submitHandler.jsw *3 ************************************/45import wixCaptcha from 'wix-captcha-backend';6import wixData from 'wix-data';78// Authorize token and insert data9export function processSubmission(submitRequestData) {10 return wixCaptcha.authorize(submitRequestData.token)11 .then( () => {12 return wixData.insert("MyCollection", submitRequestData.data)13 .then( () => ({"type": "success"}))14 .catch( (error) => ({"type": "insertion error",15 "message": "Error: collection insertion failed: " + error}));16 })17 .catch( (error) => ({"type": "authorization error",18 "message": "Error: reCAPTCHA authorization failed: " + error}));19}2021/********************22 * client-side code *23 ********************/2425import {processSubmission} from 'backend/submitHandler';2627$w.onReady(function () {28 // When user clicks submit button29 $w("#submitDataButton").onClick(() => {30 let submitRequestData = {31 token: $w("#myCaptcha").token,32 data: $w("#myInput").value,33 }34 processSubmission(submitRequestData) // Call backend function35 .then( (response) => {36 // Display a different message depending on response from backend function37 switch(response.type){38 case "success":39 $w("#messageText").text = "Data successfully submitted";40 break;41 case "authorization error":42 $w("#messageText").text = "CAPTCHA authorization failed. Redo the CAPTCHA challenge.";43 break;44 case "insertion error":45 $w("#messageText").text = "Database error. Redo the CAPTCHA challenge.";46 break;47 }48 $w("#myCaptcha").reset();49 $w("#submitDataButton").disable();50 $w("#messageText").show();51 });52 });5354 // Error handler55 $w("#myCaptcha").onError(() => {56 $w("#messageText").text = "The reCAPTCHA element lost connection with the CAPTCHA provider. Try again later.";57 $w("#messageText").show()58 .then(() => {59 $w("#messageText").hide("fade", {"delay": 10000});60 } );61 })6263 // Verification handler64 $w("#myCaptcha").onVerified(() => {65 $w("#submitDataButton").enable();66 $w("#messageText").hide();67 })6869 // Timeout handler70 $w("#myCaptcha").onTimeout(() => {71 $w("#submitDataButton").disable();72 $w("#messageText").text = "The CAPTCHA has timed out. Please redo the CAPTCHA challenge.";73 $w("#messageText").show();74 });75});76