Tenemos el siguiente código cargado en un WebView en React Native:
<!DOCTYPE html> <html> <head> <style> body { display: flex; justify-content: left; align-items: top; } </style> </head> <body> <div id="inline-badge"></div> <script src="https://www.google.com/recaptcha/api.js?render=explicit&onload=onRecaptchaLoadCallback"></script> <script> alert('js is running'); function onRecaptchaLoadCallback() { alert('onRecaptchaLoadCallback loaded'); } </script> </body> </html>` Lo que se espera que suceda es que el código se cargue para Recaptcha desde https://www.google.com . Una vez cargado, onload=onRecaptchaLoadCallback llamará a la función onRecaptchaLoadCallback.
Esto funciona en iOS. La alerta para js is working , luego de cargar el script, se llama a la función onRecaptchaLoadCallback (y muestra el contenido de la alerta)
En Android, solo recibimos la primera alerta, pero nunca se llama a onRecaptchaLoadCallback.
Aquí está el código del componente WebView como referencia:
<WebView nativeID={id} style={{ width: 0, height: 0 }} originWhitelist={['*']} startInLoadingState={true} javaScriptEnabledAndroid={true} javaScriptEnabled={true} domStorageEnabled={true} mixedContentMode="always" allowUniversalAccessFromFileURLs={true} source={{ html: recaptchaHtmlWithKey, baseUrl: 'https://www.our-site-url.com' }} onMessage={(event) => { onCheck(event.nativeEvent.data) }} />También tenga en cuenta que tenemos el permiso de INTERNET establecido en el archivo Gradle de Android.