Google ReCaptchaをAngular2で実装する

Question

私は現在、Angular 2のアプリケーションを開発しており、ユーザー検証にGoogleのReCaptchaを使用したいと考えています。しかし、私が今までに見たコミュニティー作成モジュールのすべては、APIにサインアップすると提供される秘密鍵でサーバーサイド認証を使用していないようです。

以前は、Javascriptで明示的なレンダー機能を使用してReCaptchaを実装しました。しかし、私はAngular 2 Typescriptコード内で同じ機能をどのように実装するのかは不明です。理想的には、ユーザーにReCaptchaをクリックさせ、ReCaptchaが完了してユーザーがフォームを送信できるようにしたら、送信ボタンを表示させてから、バックエンドサーバーが秘密キーを含む最終確認を完了するようにしたい。これは、http.post呼び出しによって行われます。

https://developers.google.com/recaptcha/docs/verify

：しかし、通常提出することは、私は、ユーザーがreCAPTCHAのガイドで説明したようにフォームを送信するときhttp.postを経由して送信を取得することになっています「G-reCAPTCHAの応答」を私に提供しません。

ヒントや経験がある方は教えてください。また、必要な追加情報がある場合は質問してください、私は比較的新しいここで質問を投稿しています。

Answer 1

これを角度2で説明する素晴らしい投稿があります。私はそれがあなたにこれにどのようにアプローチするかを考えさせるかもしれないと思う。
ユーザーが[recaptcha]ボタンをクリックすると、バックエンドサーバーに電話をかける必要があります。この後、確認のためにGoogleのrecaptcha apiにサイトキーを送信することができます。

app.get('/validate_captcha', (req, res) => { 
     const options = { 
     method: 'POST', 
     uri: 'https://www.google.com/recaptcha/api/siteverify', 
     qs: { 
      secret, 
      response: req.query.token 
     }, 
     json: true 
     }; 

     rp(options) 
     .then(response => res.json(response)) 
     .catch(() => {}); 

    }); 

これは、バックエンド側で役立ちます。
この記事または文書で述べたように、フロントエンドでgrecaptcha-responseが得られます。
recaptcha