Captcha

Angular Bootstrap 5 Captcha plugin

Captcha is a form validation component based on Recaptcha. It protects you against spam and other types of automated abuse.
Official documentation.

Note: Read the API tab to find all available options and advanced customization


Basic example

Note: You need to include Google API script in your project in order to Captcha to work.

        
            
          <script src="https://www.google.com/recaptcha/api.js"></script>       
          <mdb-captcha
          [sitekey]="'YOUR_SITEKEY'"
          ></mdb-captcha>
      
        
    

Dark theme example

You can use dark theme by adding [theme]="'dark'" input.

        
            
        <script src="https://www.google.com/recaptcha/api.js"></script>       
        <mdb-captcha
          [sitekey]="'YOUR_SITEKEY'"
          [theme]="'dark'"
        ></mdb-captcha>
        
        
    

Captcha - API


Import

        
            
          import { MdbCaptchaModule } from 'mdb-angular-captcha';
          …
          @NgModule ({
            ...
            imports: [MdbCaptchaModule],
            ...
          })
        
        
    

Inputs

Name Type Values Default Description
sitekey String - null Required. Defines your sitekey.
theme String light
dark
light Optional. Defines theme for Captcha.
size String normal
compact
normal Optional. Defines the size of the widget.
tabindex Number - 0 Optional. Defines the tabindex of the widget and chellenge. If other elements in your page use tabindex, it should be set to make user navigation easier.
lang String "pl", "en", "es" etc. en Optional. Defines the language of the widget.

Outputs

Name Description
expire Emmited when CAPTCHA encounters an error.
error Emmited when CAPTCHA response expires and the user needs to solve a new CAPTCHA.
success Emmited when user submits a successful CAPTCHA response.

Methods

Name Parameters Description
reset - Resets the Captcha plugin.
getResponse - Returns the Captcha response key.