Javascript Google reCaptcha是否可以在React.js中工作？

我越来越近了。。。在中加载元素是可以的，除了以下事实：reCaptcha脚本的工作方式使它在创建“g-reCaptcha”类的实例时不会进行渲染。所以如果我使用

// the div that contains the reCaptcha is in < Contact / >
ReactDOM.render( < Contact / > , document.getElementById('non-header'));

// adding another recaptcha/api.js to the head
var imported = document.createElement('script');
imported.src = 'https://www.google.com/recaptcha/api.js';
document.head.appendChild(imported);

//包含reCaptcha的div位于
ReactDOM.render（，document.getElementById（'non-header'）；
//向头部添加另一个recaptcha/api.js
var imported=document.createElement（'script'）；
imported.src=https://www.google.com/recaptcha/api.js';
文件.头.子项（导入）；

这显然是一个可怕的解决方案，因为每次加载“联系人”时，头部都会附加另一个脚本。不仅如此。。。在最初的文档中，我已经在头上放了一个reCaptcha脚本（这只是一次又一次地重复）。使用库API和重置reCaptcha不起作用（请参见下文）

ReactDOM.render（，document.getElementById（'non-header'）；
//var imported=document.createElement（'script'）；
//imported.src=https://www.google.com/recaptcha/api.js';
//文件.头.子项（导入）；
grecaptcha.reset（）；
74:2错误“grecaptcha”未定义无未定义！！！

因此，我需要在React中访问reCaptcha div的脚本方法。js是一个非常基本的React组件。它可能只是

import React, { Component } from 'react';
import './css/Contact.css';

class Contact extends Component {
    render() {
        return (
            <div className='g-recaptcha' id='recaptcha' data-sitekey='******************************'></div>
        );
    }
}

import React，{Component}来自'React'；
导入“./css/Contact.css”；
类接触扩展组件{
render（）{
返回(
);
}
}

如果有人能给我提供一些指导的话，也许哪怕只是想一想在React组件中包含第三方脚本的正确方法也会有很大帮助

这似乎是正确的线索（链接：）？

您可以使用

这个图书馆很好用。下面是用法：

<Recaptcha sitekey="" 
    render="explicit" 
    hl={"ja"} 
    onloadCallback={} 
    verifyCallback={*} />

不确定这是否对您有所帮助，但该组件是开箱即用的：我希望使用GitHub项目作为一个选项，我已经看到了一些不错的项目，并使用了它：我想我更愿意在不使用它的情况下使用它。我正在尝试学习React，所以我最终需要了解导入库（或者这不是它的主要功能）。如果在param中需要传递密钥，如何验证回调？如果你想要一个安全的站点，你必须在前端只持有公钥。您必须在后端使用密钥。当你使用这个库时，这将为你生成一个密钥，你将用你的表单属性发送这个密钥，你将用你的密钥和生成的密钥向谷歌发出请求。谷歌将为您成功与否做出响应一个示例请求：https://www.google.com/recaptcha/api/sitevirify？secret={your_secret\u key}&response={generated\u key}“&remoteip=192.168.1。234@VahapGen在URL中使用密钥难道不是一个安全问题吗？也就是说，它们可以放在日志文件中，并以其他方式存储在系统上。我使用的查询与后台使用的密钥一起使用，它使用的是将验证码发送到google，这不是不安全的

<Recaptcha sitekey="" 
    render="explicit" 
    hl={"ja"} 
    onloadCallback={} 
    verifyCallback={*} />