Tengo la siguiente función que se ejecuta cada vez que se debe usar recaptcha. El problema es que el script no está listo o aún no se ha agregado como elemento secundario cuando quiero usar grecaptcha. Document.createElement("recaptcha_script") siempre es nulo cuando quiero usarlo. No estoy seguro de si hay una mejor manera o una solución a mi problema. No quiero usar un paquete npm.

 export const RecaptchaAPI = async () => { const recaptchaScript = async () => { const script = document.createElement("recaptcha_script"); script.src =`https://www.google.com/recaptcha/api.js?render=${process.env.REACT_APP_RECAPTCHA_SITE_KEY}`; script.async = true; document.body.appendChild(script); script.onload = recaptchaRequest(); } const recaptchaRequest = () => { const element = document.getElementById("recaptcha_script"); element.grecaptcha.ready(() => { element.grecaptcha.execute('reCAPTCHA_site_key').then((token) => { console.log("worked"); }); }); } return await recaptchaScript()}