Handle All Error From ReCaptchaV3Service

[yanchespenda]

Summary

I'm submitting a:

• bug report
• feature request
• question / support request
• other

Description

When internet connection slow or something it will show Uncaught (in promise): [object Null] in console,
I was trying from using pipe errorCache before subscribe() still does not work

Sometimes i get error same with #123 (comment)

A_LINK_WITH_YOUR_EXAMPLE
I'm used the code like this
https://stackblitz.com/edit/angular-t6kdki

Lib versions:

• ng-recaptcha: 5.0.0
• Angular: 8.2.0
• Typescript (tsc --version): 3.5.3

Thank you for help!

[Smip]

@yanchespenda Hi, how did you solve this problem?

[yanchespenda]

@Smip I'm used timeout for cheking a error from the captcha

Like this,

recaptchaTimeout() {
    setTimeout(() => {
      if (this.isLoading && !this.isHttpLoading) {
        this.isLoading = false;
        this.errorMSG = 'Recaptcha Error, make sure your internet connection stable';
        this.isErrorPrimary = true;
      }
    }, 5500);
}

For submit form

SubmitA() {
    this.isErrorPrimary = false;
    this.isLoading = true;
    this.recaptchaTimeout();
    this.recaptchaUnsubscribe();
    this.recaptchaSubscriber = this.recaptchaV3Service.execute('login_a1')
      .subscribe((token) => {
        if (token === null) {
          // Response is null due to what? Expiration? reset?
          this.recaptchaUnsubscribe();
          return;
        }
        this.isHttpLoading = true;

        // Http services form
        ....
        // If http success
        this.isLoading= false;
   });
}

[Smip]

@yanchespenda Thank you!

[Smip]

More concise solution is:

SubmitA() {
  this.recaptchaV3Service.execute('login_a1')
      .pipe(
        timeoutWith(5000, throwError(new Error('timeout'))),
      )
      .subscribe(
        (token) => {
          // handle captcha token
        },
        (error) => {
          if (error.message === 'timeout') {
            // handle timeout
          }
        },
      );
}