該
例如，如果我注冊頁面會將我重定向到登錄頁面，并且徽章也會顯示在那里。我試影像這樣實作 ngOnDestroy 方法：
ngOnDestroy() : void{
if (this.recaptchaSubscription) {
this.recaptchaSubscription.unsubscribe();
}
const element = document.getElementsByClassName('grecaptcha-badge')[0];
if(element){
this.renderer2.removeChild(this.document.body, element.parentElement);
}
}
這作業正常，我被重定向到登錄頁面而沒有顯示徽章，但是如果我嘗試注冊新用戶，我會失去驗證碼保護。就像不再生成驗證碼組件一樣。
更新
要使用驗證碼，我只需像這樣將服務添加到建構式中
constructor(...
private recaptchaV3Service: ReCaptchaV3Service,
...) { }
然后我在需要時使用它
onSubmit(): void{
this.recaptchaSubscription = this.recaptchaV3Service.execute('registerCustomer').subscribe((recaptchaToken) => {
//Do things
});
同樣在我的 app.module 中，我必須在提供者部分添加它：
providers: [
ReCaptchaV3Service,
{ provide: RECAPTCHA_V3_SITE_KEY, useValue: environment.captchaKey }
],
uj5u.com熱心網友回復：
我們在這些情況下所做的不是從 DOM 中洗掉徽章，只是切換可見性，因此AfterViewInit- 顯示徽章：
ngAfterViewInit() {
const element = document.getElementsByClassName('grecaptcha-badge')[0] as HTMLElement;
if (element) {
element.style.visibility = 'visible';
}
}
當然，OnDestroy我們把它隱藏起來：
ngOnDestroy() {
if (this.recaptchaSubscription) {
this.recaptchaSubscription.unsubscribe();
}
const element = document.getElementsByClassName('grecaptcha-badge')[0] as HTMLElement;
if (element) {
element.style.visibility = 'hidden';
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/393280.html
標籤：有角的 离子框架 recaptcha-v3