在 onMessage() 上反应本机 recaptchaV3 returns 不工作

React native recaptchaV3 returns on onMessage() not working

由于大多数 react-native-recaptchaV3 库已经过时,我正在尝试创建组件以获取不可见的 recaptchaV3。但是onMessage()returns什么都拿不到token。谁能帮我完成这件事?

当我删除 androidLayerType="software" 应用时崩溃了。如果我使用 androidLayerType="software" 我在控制台中未定义。

"react-native-webview": "^11.17.2",

class ReCaptchaComponent extends React.Component {
  _webViewRef = React.createRef();
  constructor(props) {
    super(props);
  }

  render() {
    return (
      <View style={{flex: 0.0001, width: 0, height: 0}}>
        <WebView
          ref={ref => {
            this._webViewRef = ref;
          }}
          androidLayerType="software"
          javaScriptEnabled
          originWhitelist={['*']}
          automaticallyAdjustContentInsets
          mixedContentMode={'always'}
          onMessage={(e: any) => { console.log('onReceiveToken',e.nativeEvent.data);
          }}
          source={{html: recaptchaHtml,baseUrl: 'https://testing.xyz'}}
        />
      </View>
    );
  }
}

const recaptchaHtml = `<!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>
    function onRecaptchaLoadCallback() {
      var clientId = grecaptcha.render('inline-badge', {
        'sitekey': '_xBu49Sf-rsc1',
        'badge': 'inline',
        'size': 'invisible'
      });
      grecaptcha.ready(function () {
        grecaptcha.execute(clientId, {
          action: 'verify'
        })
          .then(function (token) {
            window.ReactNativeWebView.postMessage(token, '*')
          });
      });
    }
  </script>
</body>
</html>`;
export default ReCaptchaComponent;

我已经添加了

react-native-webview -> android -> src -> java -> RNCWebViewManager.java

on onReceivedSslError 方法我已经改变了,

handler.cancel()

handler.proceed();