简体   繁体   中英

Submit form with JS after captcha validation

I've just included the sections I thought were relevant. I would like the form to submit once the JS validates Captcha. But it never goes to the next page. What am I missing?

<body>
<div class="wrapper">
    <header>Captcha in JavaScript</header>
    <div class="captcha-area">
      <div class="captcha-img">
        <img src="captcha-bg.png" alt="Captch Background">
        <span class="captcha"></span>
      </div>
      <button class="reload-btn"><i class="fas fa-redo-alt"></i></button>
    </div>
    <form name:"myform" action="checkout5.php" class="input-area" method="post">
      <input type="text" placeholder="Enter captcha" maxlength="6" spellcheck="false" required>
      <button type:"submit" value="submit" class="check-btn">Submit</button>
    </form>
    <div class="status-text"></div>
  </div>
  <script src="script.js"></script>
</body>
<script>
checkBtn.addEventListener("click", e =>{
  e.preventDefault(); //preventing button from it's default behaviour
  statusTxt.style.display = "block";
 let inputVal = inputField.value.split('').join(' ');
  if(inputVal == captcha.innerText){ //if captcha matched
        statusTxt.style.color = "#4db2ec";
        statusTxt.innerText = "Nice! You don't appear to be a robot.";
        setTimeout(()=>{ //calling removeContent & getCaptcha after 2 seconds
        removeContent();
        getCaptcha();
        }, 2000);
  }else{
    statusTxt.style.color = "#ff0000";
    statusTxt.innerText = "Captcha not matched. Please try again!";
  }
});

</script>
</html>

You can validate your Captcha on server side (this ex Django).

            # Get Captcha Response
            captcha_response = request.POST['g-recaptcha-response']

            # Get Google Recaptcha Secret key
            secret_key = settings.GOOGLE_RECAPTCHA_SECRET_KEY

            # Captcha Payload
            captcha_payload = {
                'secret': secret_key,
                'response': captcha_response
            }

            # Verify Captcha Response
            captcha_verify = requests.post(
                "https://www.google.com/recaptcha/api/siteverify", data=captcha_payload).json()

            # Check if Captcha not Success
            if not captcha_verify['success']:
                return JsonResponse({"error": "Invalid reCAPTCHA Please try again..."}, status=400)
            else:
                #your after validate code

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM