How to Implement Invisible CAPTCHA on VueJS


First, you should get your Captcha ID and Captcha Div ID
Please visit for more information: Displaying Lemin CAPTCHA


Install captcha wrapper with npm:

npm i @leminnow/vue-lemin-cropped-captcha 

Also, you can install captcha wrapper with yarn:

yarn add @leminnow/vue-lemin-cropped-captcha 


Use LeminCroppedCaptcha component in your View:

Lemin Captcha must be placed inside of a “form” element.


This component prepares the lemin captcha and marks where the captcha will appear if necessary.

Please ensure that your captcha-div-id is the same as the captcha-div-id you've set before. If you set a captcha-div-id for your Lemin Captcha in the advanced settings, this div must have that same captcha-div-id. (default: "lemin-cropped-captcha")

Usage Examples

Automatically bind the challenge to a button

Please ensure you set the ID field of your form submit element to "leminSubmitButton".

If this method is not suitable for you, consider using the programmatically invoke the challenge method.

  <form @submit.prevent="onSubmit">

    <button class="btn btn-primary" id="leminSubmitButton">Submit</button>

<script setup lang="ts">
import {
} from "@leminnow/vue-lemin-cropped-captcha";
import { ref } from "vue";

const captchaRef = ref();

const captchaId = "..."; // your captcha div id
const containerId = "CROPPED_..."; // your captcha id

function onSubmit() {
  const captchaValues = leminCroppedCaptcha
  const isCaptchaValid = captchaValues.answer && captchaValues.challenge_id;

  if (isCaptchaValid) {
    //execute your method

Programmatically invoke the challenge

To use this feature, you must have version 0.2.0 or newer of the @leminnow/vue-lemin-cropped-captcha package.

If you use the programmatically invoke challenge method, please ensure that the submit button ID is NOT "leminSubmitButton".

If you wish to have more control over when the Invisible Captcha runs, you can use the execute method in leminCroppedCaptcha object. 


function onYourHandler() {
  const captcha = leminCroppedCaptcha.getCaptcha();

  captcha.execute().then(({ answer, challenge_id }) => {
    const isCaptchaValid = answer && challenge_id;

    if (isCaptchaValid) {
      //execute your method