Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/leNicDev/ng-hcaptcha below:

leNicDev/ng-hcaptcha: :fire: hCaptcha Component for Angular

ng-hcaptcha provides an easy to use component for hCaptcha.

• Supported Angular versions
• Installation
• Usage
• Execute hCaptcha programmatically
• Bugs? Ideas?
• Support me

The latest version of ng-hcaptcha currently supports Angular v9 to v20.

# NPM
npm install --save ng-hcaptcha

# Yarn
yarn add ng-hcaptcha

You can use the tag 'next' to get the latest beta version.

import { NgHcaptchaModule } from 'ng-hcaptcha';

@NgModule({
    imports: [
        // Option #1
        // Set the sitekey globally for every hCaptcha component
        NgHcaptchaModule.forRoot({
            siteKey: 'YOUR_SITEKEY',
            languageCode: 'de' // optional, will default to browser language
        }),

        // Option #2
        // This option requires you to set the [siteKey] property for every hCaptcha component
        NgHcaptchaModule.forRoot()
    ]
})

Template:

<!-- Regular usage -->
<ng-hcaptcha (verify)="onVerify($event)" (expired)="onExpired($event)" (error)="onError($event)"> </ng-hcaptcha>

<!-- Usage in forms -->
<!-- The value of the form control will be the verification token -->
<form [formGroup]="formGroup" (submit)="onSubmit()">
  <ng-hcaptcha formControlName="captcha"></ng-hcaptcha>
</form>

<!-- Invisible captcha -->
<button ngHcaptchaInvisibleButton (verify)="onVerify($event)" (expired)="onExpired($event)" (error)="onError($event)">Click me</button>

TS:

onVerify(token: string) {
    // The verification process was successful.
    // You can verify the token on your server now.
}

onExpired(response: any) {
    // The verification expired.
}

onError(error: any) {
    // An error occured during the verification process.
}

The hCaptcha verification process can also be executed programmatically:

@Component({
  selector: "hc-programmatically",
  templateUrl: "./programmatically.component.html",
  styleUrls: ["./programmatically.component.scss"],
})
export class ProgrammaticallyComponent {
  constructor(private hcaptchaService: NgHcaptchaService) {}

  verify() {
    this.hcaptchaService.verify().subscribe(
      (result) => {
        console.log("SUCCESS", result);
      },
      (err) => {
        console.log("FAILED", err);
      },
      () => {
        console.log("COMPLETE");
      }
    );
  }
}

The properties below exist for all captcha components.

siteKey Allows you to set the site key per captcha instance.

languageCode Allows you to force a specific language. See https://docs.hcaptcha.com/languages

If you found a bug or something you don't like, feel free to open an issue. If you have any ideas for new features or improvements, feel free to contribute or open an issue 😉

If you would like to support me for free, just create your hCaptcha account using my referral link ☺️ https://hCaptcha.com/?r=4afcb2d42338

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4