Problem with reCAPTCHA

Ask the community
, ,
1

Hi,
Recently I have tried to implement a captcha onto a form. However, when I load the page in preview mode, I get this error:


Here is my code:

  $w.onReady(function () {

      $w("#captcha").onVerified(() => {
      $w("#messageText").hide();
      $w("#submitButton").enable();
  })

  $w("#submitButton").onClick(() => {
 let submitRequestData = {
 "token": $w("#captcha").token,
 "review": $w("#textBox1").value,
 "starRating": $w("#text136").text,
 "restaurantName": $w("#text151").text,
 "personName": $w("#input1").value
      }
          processSubmission(submitRequestData)
      .then( () => {
        $w("#captcha").reset();
        $w("#submitButton").disable();
        $w("#messageText").text = "Review successfully submitted!";
        $w("#messageText").show();
      })
      .catch( () => {
        $w("#captcha").reset();
        $w("#submitButton").disable();
        $w("#messageText").text = "Something went wrong. Please redo the captcha challenge.";
        $w("#messageText").show();
      })
  })
 
  $w("#captcha").onError(() => {
    $w("#messageText").text = "The reCAPTCHA element lost connection with the CAPTCHA provider. Please try again later.";
    $w("#messageText").show()
    .then(() => {
      $w("#messageText").hide("fade", {"delay": 10000});
    } );
  })

    $w("#captcha").onTimeout(() => {
    $w("#submitButton").disable();
  })
});

I have no errors in the editor.

At the top I have included

import wixCaptchaBackend from 'wix-captcha-backend';
import {processSubmission} from 'backend/submitHandler';

In the backend code file I have

import wixCaptcha from 'wix-captcha-backend';
import wixData from 'wix-data';

export function processSubmission(submitRequestData) {
 return wixCaptcha.authorize(submitRequestData.token)
    .then(() => {
 return wixData.insert("PendingReviews", submitRequestData.data);
  });
}

There are no errors in that either

I am completely stumped, can anyone help?