反応アプリを作成するにはGoogleのrecaptchaを追加するには？

私はredux-formで渡すことができるようにrecaptchaの応答を取得しようとしています。
は...以下の2つの方法を試してみました反応アプリを作成するにはGoogleのrecaptchaを追加するには？

試み1：
<head>にコールバックを指定します。

index.htmlを：

<script src='https://www.google.com/recaptcha/api.js?onload=callback&render=explicit'></script>

ここでの問題は、コールバックがグローバルスコープであるが、私はコンポーネントに反応してそれにアクセスする必要があるということです。

試行2：
DOMでのコールバックの指定。

コンポーネントは：handleRecaptcha（RESP）

handleRecaptcha(resp) { 
    console.log(resp); 
}

コンポーネント：（）レンダリング：

<div className="g-recaptcha" data-callback={this.handleRecaptcha.bind(this)} data-sitekey="***"></div>

index.htmlを：

<script src='https://www.google.com/recaptcha/api.js'></script>

recaptchaを提出した後にメッセージReCAPTCHA couldn't find user-provided function: function() { [native code] }が届きました。おそらくスコープの問題です。

私はこれがちょっとした問題だと思っているので、私は別のライブラリの使用を避けようとしています。
誰もそれについてどうなるか考えてもらえますか？

私が必要とするのは、widgetインスタンスを取得し、応答を得るためにgrecaptcha.getResponse(widget)を行うことです。 API ref

出典

2017-05-29 resting

使用react-recaptcha

import Recaptcha from 'react-recaptcha' 

<Recaptcha 
    sitekey="xxxxxxxxxxxxxxxxxxxx" 
    render="explicit" 
    verifyCallback={verifyCallback} 
    onloadCallback={callback} 
/>

出典

2017-05-29 09:58:09 oklas

雅これも代替することができます。私は今それを使用する –

反応アプリを作成するにはGoogleのrecaptchaを追加するには？

答えて

関連する問題