3

I am currently developing an application with Angular 2 and wish to employ the use of Google's ReCaptcha for user verification. However, all of the community created modules I have seen thus far don't seem to make use of server side authentication with the secret key that is provided once you sign up for the API.

I previously implemented the ReCaptcha using the explicit render functionality with Javascript. However, I am unsure how to implement the same functionality within my Angular 2 Typescript Code. Ideally, I would like to have the user click the ReCaptcha, have a submit button appear once the ReCaptcha is completed that allows the user to submit the form, and then my backend server would finish the final verification that includes the secret key. This would be done via an http.post call. However, submitting normally does not provide me with the "g-recaptcha-response" that I am supposed to be getting sending via http.post when an user submits the form as described in the ReCaptcha guides:

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

If anyone has any tips or experience please let me know. Also if there is additional information needed please ask, I am relatively new at posting questions here.

landesko
  • 373
  • 1
  • 5
  • 16
  • If you're looking for the PHP side of the equation you can have a look at [this answer](http://stackoverflow.com/a/27439796/648350). For the ng2 side you'll need to explicitly include the recaptcha value in your post to your server. ([angular2-google-recaptcha](https://github.com/rajan-g/angular2-google-recaptcha/tree/master/example) provides a demo of how to do this) – haxxxton Feb 15 '17 at 05:27

1 Answers1

0

There is a fantastic post explaining this in angular2. I think that may give you idea how to approach this.
You have to make call to your backend server after user click your recaptcha button. After this you can send your site key to google recaptcha api for verification.

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(() => {});

    });

This will help you through the backend side.
As said in this article or document, you will get grecaptcha-response in the frontend.
Look into this link recaptcha

abby37
  • 597
  • 6
  • 21