Я использую priming-captcha для своего приложения. Он работает нормально, когда я перенаправляю страницу через какую-то другую страницу. Но капча не отображается, когда я загружаю страницу напрямую ( иногда показывает, что grecaptcha.render не является функцией в консоли )
Как указано в простых лицах, я добавил скрипт (<script src="https://www.google.com/recaptcha/api.js ... tRecaptcha" async defer></script>) в индексе. html.
Кроме того, я добавил это (<p-captcha id="captcha" siteKey="sitekey" label="Captcha" (onResponse)="func($event)"></p-captcha>) в мой некоторый компонент. html.
Я пытаюсь явно его отобразить , Но все равно не повезло. Может кто-нибудь, пожалуйста, помогите мне с примером функции onLoad и где реализовать. Должен ли он быть реализован в сценарии индекса. html или где-то еще.
index. html
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Title</title> <base href="/"> <script src="https://www.google.com/recaptcha/api.js?render=explicit&onLoad=initRecaptcha" async defer></script> </head> <body> <app-root></app-root> </body> </html>
password-recovery.component. html
<div class="p-col-11"> <p-captcha id="captcha" siteKey="sitekey" (onResponse)="storeRecaptchaResponse($event)" #captcha></p-captcha> </div>
password-recovery.component.ts
storeRecaptchaResponse(event) { this.recaptchaSubmitted = true; this.recaptchaResponse = event.response; console.log('Captcha Response ' + this.recaptchaResponse); }