Step 1 - Install dependency
npm i ng-recaptcha --save
Step -2 Open app.module.ts and add below import-
import { RecaptchaModule } from 'ng-recaptcha';
Also add this to imports -
imports: [RecaptchaModule,],
Step 3 - Open that component where you want to add human verification reCAPTCHA and then add below code -
yourcomponentname.component.html
<re-captcha (resolved)="resolved($event)" siteKey="6LcOuyYTAAAAAHTjFuqhA52fmfJ_j5iFk5PsfXaU" ></re-captcha>
yourcomponentname.component.ts
public resolved(captchaResponse: string) {
console.log(`Resolved captcha with response: ${captchaResponse}`); // Write your logic here about once human verified what action you want to perform
}
Step 5 - This siteKey will work on localhost, you must have to generate your own siteKey, for this please visit google.com/recaptcha and add your domain and generate key, it's very simple and then replace the new key to markup of step3.
All done.
Top comments (0)