Question

我已经使用“ npm install react-native-recaptcha-v3”进行了Recaptcha集成。但是它给出了警告失败的prop类型：prop'url'在'ReCaptcha'中被标记为必需，但是其值为'undefined'。我做错了什么？

如何解决？

     render() {
        return (
        <View>
        <ReCaptcha
          sitekey= {this.props.sitekey}
          verifyCallback={this.verifyCallback.bind(this)}
        />
       </View>
       );
      }

Answer 1

似乎您正在查看React.js与React Native。

React.js软件包不适用于React Native。将React Native视为React.js的一个非常特定的版本，因为它是专门为移动设备（特别是Android和iOS）构建的。

有些特定于React Native的软件包，例如this one。

我还会考虑用户体验以及为什么需要在手机上安装Recaptcha。

这并不是理想的用户体验，因为人们在连接不良时会很沮丧，并且会放弃。

Answer 2

<ReCaptcha
   siteKey={SiteKey}
   action="<action_name>" // it's not required but you can it if you are using recaptcha more than one time.
   url="<use_any_valid_url_or_app_related_url>"
   reCaptchaType={1}
   onExecute={(res) => {
      this.setState({ reCaptcha: res });
   }}
/>

react-native-recaptcha-v3需要URL道具，因此您可以传递任何有效的URL或与应用程序相关的URL，并确保URL以“ https://stackoverflow.com/”开头。如果您仅使用“ stackoverflow.com”作为URL，则会显示URL错误。从render onExecute（）开始执行并在res变量中，您就获得了recaptcha令牌，可将其用于验证recaptcha。还有一点，react-native-recaptcha-v3中没有像 verifyCallback 这样的道具。所以不要使用它。

如何在React Native App中实现Recaptcha？

2 个答案: