I'm using a static Blazor SSR project with Google ReCAPTCHA Enterprise. The ReCAPTCHA uses a checkbox. The implementation would be to add the following script to a page like the following example:
@page "/"<PageTitle>Home</PageTitle><div class="container-fluid"><section class="container-lg py-3"><h3 class="text-center">Contacta con nosotros</h3><p class="text-center">Envienos un correo y nos pondremos en contacto con usted.</p><EmailForm/></section> </div> <HeadContent><script src="https://www.google.com/recaptcha/enterprise.js" async defer></script> </HeadContent>The <EmailForm/> component is a form like the following:
<EditForm Enhance Model="ContactEmail" OnValidSubmit="HandleSubmitAsync" FormName="contactForm"><DataAnnotationsValidator/><CustomValidation @ref="_customValidator"/><div class="mb-3"><label class="form-label">Nombre:</label><InputText class="form-control" @bind-Value="@ContactEmail.Name"/><ValidationMessage For="@(() => ContactEmail.Name)"/></div> ... more code ...<div class="g-recaptcha" data-sitekey="@SiteKey"]" data-action="@DataAction"></div><button type="submit" class="btn btn-primary">Enviar</button></EditForm>Getting a result as can be seen in the following image:
When you change pages and return to the form page, the ReCAPTCHA disappears and does not reappear unless the page is reloaded again.
What is the reason for the ReCAPTCHA to disappear and not reappear? or how can I make it reappear?
What is desired is that the ReCAPTCHA always appears.