Solution: Google recaptcha on a Wix Code form

For anyone who needs it. It´s an implementation of recaptcha V2 using the html-component.

1 Like

Good day,

I did follow the steps, all good until the last one, but when I click submit without reCaptcha, the database gets updated, so I removed the connection between the button and the DB

Then I did try again, but nothing happen, when I go in the Editor, select the button and click OnClick event, a pop-up error message say: We couldn’t find the function for your event because of errors in your code

I did follow all the steps, what should I do now, please?

Here is the link to the form in the website:

Warm Regards

Could you show me your code?

Hi Giri,

as requested, this the code, when I click the button, the recaptcha work but the database don’t get updated, and if I link the button to the DB, it will get updated regardless of the recaptcha working or not

How can I fix this, please?

import {
from ‘backend/recaptcha’;

let gToken = “”;
let strIpAddress = “”;

$w.onReady( async function () {
strIpAddress= await chkIpAddress ();

$w("#frmReCaptcha").onMessage((event) => { 

if (event) {
gToken =;

export async function btnSubmit_click(event, $w) {
let boolOK= await verifyCaptcha(gToken, strIpAddress);
if (boolOK) {
console.log("Verification result = " + boolOK);
//todo: redirect to page or show box or show a message
export async function chkIpAddress() {
const httpResponse = await fetch(‘’, {
method: ‘get’

if (httpResponse.ok) {
const json = await httpResponse.json();
const ipaddress = await json.query;
return ipaddress;

Familiar code: that´s my example code. There is a lot missing: you have not connected the added reCaptcha-logic to the yes/no saving of the data. There are 2 ways to do that:

  • doing a .save() in code when repaptcha=OK on the dataset in front end code. This is DANGEROUS and I specifically warn against it in my article, so I won´t even go there:
  • doing an Insert using wix-data in the backend, calling a fuction that passes all form data to this backend function.
    Last method is how it should be done, but it involved some pretty interesting coding: you cannot click, drag and drop your way out of it, This has got little to do with the recaptcha being complex, it has to do with security.
    I fear this is going to be too complex for you, but if you want to prove me wrong, try, and if you get stuck somewhere, I´ll try to help you BUT NOT WHEN YOU TRY TO SAVE FROM THE FRONT END.
    Good luck, sorry that I do not have better news.

Thank you Giri for your prompt answer,

I’m trying to work on it, will see how I get to


Hi Giri, I also tried to implement this but it’s way beyond my capabilities. Are you a ‘Wix Expert’ by any chance so that you can implement this solution for someone like me? Cheers, Nat

Hi Giri,

Thank you for this, I’ve implemented this, a problem I have now is that the form is submitting without the captcha being selected. Do you have ideas on what I need to lookout for?

Hi KAren. I believe you ask how to link the Google result to your form. Well, to have a secure solution, I would do this. I would disable the Submit-button by default.In the " if (boolOK) " part I would do 2 things:

  1. enable the button
    2)call a backend function with all data from the form PLUS the google verification, check if all is well there (= in backend code), then write data to db using wix-data, set a result back to frontend and respond to that (either an error or a redirect to another (Thank you page).

The second step is important, DO NOT rely on front-end code only.

1 Like

For anybody who’s interested in this feature: the reCAPTCHA Editor Element has been released .