I am trying to build a reusable Google reCAPTCHA LWC component for our org. I have successfully implemented this in Experience Cloud for another org we have, however that org is using the standard Lightning Community Builder. I followed this tutorial: https://www.learnexperiencecloud.com/s/article/Implementing-reCAPTCHA-in-Community-Cloud
In this tutorial we modify the markup directly in the community builder itself. This worked on the other org we have that uses the community builder.
An older org we have uses standard Visualforce community. I am trying to render this LWC reCAPTCHA component using Lightning Out. I can see the component is called, I see the browser inspector's logs and it is working correctly, however the actual "I am not a robot" checkbox I cannot get to display. I tried adding static text "test123" to the LWC and it is displaying in Visualforce. So I am doing something wrong where the reCAPTCHA checkbox just isn't displaying.
One reason could be is I don't have any place to put the markup. Trying to put it on the VF page throws me an error with the link to the reCAPTCHA script:
<script src='https://www.google.com/recaptcha/api.js?render=explicit&onload=onloadCallback' async defer></script>
Error when deploying page:
The reference to entity "onload" must end with the ';' delimiter.
I posted this question to Stackexchance but have no answers yet.
Is it possible I can put the markup which includes the above script directly into LWC? I'm not sure if this missing markup is causing the reCAPTCHA to not display, but I don't know why else it isn't showing.
I was thinking of trying to put this LWC directly into an app page in Salesforce instead of VF to see if it will even display there. But in that case I still don't know where to put the markup!