This content originally appeared on DEV Community and was authored by Rajesh Kumar Yadav
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.
This content originally appeared on DEV Community and was authored by Rajesh Kumar Yadav
Rajesh Kumar Yadav | Sciencx (2021-06-03T06:10:20+00:00) Angular : How to add reCAPTCHA feature in your angular app just in 5 minutes?. Retrieved from https://www.scien.cx/2021/06/03/angular-how-to-add-recaptcha-feature-in-your-angular-app-just-in-5-minutes/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.