集成在angular2/angular4重新验证码

背景集成在angular2/angular4重新验证码

我试图整合与角4做了一个单页的应用程序我设置了sitekey与grecaptcha.render(elt, {sitekey : 'XXX-my-public-key'});再次验证码。

问题

当我打电话grecaptcha.render()，我不能肯定的ReCaptcha JS被加载。因此，有时候，我得到这个错误：

LoginComponent_Host.html:1 ERROR ReferenceError: grecaptcha is not defined

问题

我如何可以肯定的是重新验证码呼吁grecaptcha.render()完全加载之后？

这里是代码中的相关部分：

的index.html

<html> 
    <head> 
    <script src='https://www.google.com/recaptcha/api.js'></script> 
    </head> 
</html>

login.component.html

<div #captchaDiv class="m-t"></div>

login.component.ts

@Component({ 
    selector: 'app-login', 
    templateUrl: './login.component.html', 
    styleUrls: ['./login.component.less'] 
}) 
export class LoginComponent implements OnInit, AfterViewInit { 

    @ViewChild('captchaDiv') 
    captchaDiv: ElementRef; 

    [...] 

    ngOnInit(): void { 
    grecaptcha.render(this.captchaDiv.nativeElement, {sitekey : 'XXX-my-public-key'}); 
    }

来源

2017-08-13 Arnaud Denoyelle

-1

尝试使用这个RecaptchaModule，https://www.npmjs.com/package/ng-recaptcha

@Component({ 
    selector: 'my-app', 
    template: `<re-captcha (resolved)="resolved($event)" siteKey="YOUR_SITE_KEY"></re-captcha>`, 
}) export class MyApp { 
    resolved(captchaResponse: string) { 

    } 
}

来源

2018-01-31 19:01:07

集成在angular2/angular4重新验证码

回答

相关问题