babaktaremi / GoogleCaptchaComponent

🤖 Implementation of google reCaptcha as a blazor component with support of reCaptcha-V2 and reCaptcha-V3 and server validation
MIT License
78 stars 16 forks source link

Problem after going back to page with recaptcha. #7

Closed sikora507 closed 1 year ago

sikora507 commented 1 year ago

I am using the script loader in App.razor <script src="_content/GoogleCaptchaComponent/Scripts/ScriptLoader.js"></script> I think that's the reason why recaptcha stops working when i visit the page protected with <GoogleRecaptcha> for the second time

  1. I am going to a page protected with recaptcha v3 (everything works great)
  2. I am going to some other page
  3. I go back to the first page protected by recaptcha again
  4. I get error from google's validation response from endpoint in my ServerSideValidationHandler after POST to https://www.google.com/recaptcha/api/siteverify Captcha serverside validation error: Recaptcha validation failed: browser-error

The browser-error comes from google. (googleReCaptchaResponse.ErrorCodes)

But if I rerender whole page after refreshing in the browser, everything works again until i visit the recaptcha protected page for the second time.

I guess that's because the script is loaded only once, and <GoogleRecaptcha> is rendered twice, and maybe that's what causing the issue. I wonder how to mitigate this.

sikora507 commented 1 year ago

I see now that when i go to other page and back, the loading script is not loading google's recaptcha file:

image

As you can see there's only scriptloader, however during initial load it looks like it adds the actual google's script too:

image

I use dotnet 8 preview 7 and the page is rendered using @attribute [RenderModeServer]

babaktaremi commented 1 year ago

Yeah I just recreated the bug my self (it's pretty random. STRANGE). Server Mode rendering is not the issue (since the google recaptcha is rendered on client side any way) currently working on an update to fix this issue. Also support for NET 8 Blazor will be added once the LTS version of NET 8 is released (with many optimizations and new features!)

babaktaremi commented 1 year ago

check the browser console . I think this error happens when the related request to reload api from google is cancelled and the given captcha response is invalid because of that

babaktaremi commented 1 year ago

I see now that when i go to other page and back, the loading script is not loading google's recaptcha file: image As you can see there's only scriptloader, however during initial load it looks like it adds the actual google's script too: image I use dotnet 8 preview 7 and the page is rendered using @Attribute [RenderModeServer]

Version 3.2.0 is currently in listing process and will be available in the next couple of hours. This issue is fixed. In Previous versions , we kept the track of loaded scripts with javascript (which would fail in scenarios where you refresh the page frequently and caused multiple script loading and race condition) . With this update , I created a Cache Container Service which registers as singleton and from there we keep the track of loaded scripts thus preventing loading the same script twice. Please let me know if there are any issues with this update

babaktaremi commented 1 year ago

Closing the issue. Feel free to reopen it if you encounter this problem again