3

Very recently invisible Captcha is released by google. https://www.google.com/recaptcha/intro/invisible.html

Is there a way to integrate this system with help of AngularJS?

Clarification This question is not about regular reCaptcha from Google. I am asking about Invisible reCaptcha. Here is the detailed situation.

My registration form is already using AngularJS. The form submission is triggered by AngularJS standards. The invisible reCaptcha requires me to give callback function for form submission. Which is confusing part.

Hemen Ashodia
  • 499
  • 3
  • 16
  • The google Captcha system uses their script to process the captcha then tell your script it is successful. What would you need AngularJS to "help" with? – Claies Mar 20 '17 at 00:26
  • Possible duplicate of [Recaptcha in Angular JS](http://stackoverflow.com/questions/21453979/recaptcha-in-angular-js) – Daniel Bernsons Mar 20 '17 at 00:26
  • @DanielBernsons there is a difference between reCaptcha and invisible reCaptcha from google. – Hemen Ashodia Mar 20 '17 at 00:36
  • @Claies My registration form is already using AngularJS. The form submission is triggered by AngularJS standards. The invisible reCaptcha requires me to give callback function for form submission. Which is confusing part. – Hemen Ashodia Mar 20 '17 at 00:38
  • what does "the form is triggered by AngularJS standards" mean? AngularJS is just JavaScript, and so is the invisible reCaptcha. there isn't anything in AngularJS that would stop the processing of the captcha. The callback is simply the function that you would normally trigger after the captcha is successful; most likely, that's what you were triggering on `ng-click`. – Claies Mar 20 '17 at 01:08
  • you also could call the invisible reCaptcha challenge from within any other JavaScript function, including an angular function. https://developers.google.com/recaptcha/docs/invisible. Also, that document clearly states "This works the same as the normal reCAPTCHA challenge.". Therefore, the question @DanielBernsons linked is still relevant. – Claies Mar 20 '17 at 01:13
  • @Claies my angularjs form is submitted using ng-submit="registrationSubmit()" So should I use ? – Hemen Ashodia Mar 20 '17 at 08:58
  • Seems reasonable, have you tried it? – Claies Mar 20 '17 at 10:51

1 Answers1

2

You cannot reference directly the angularJs function inside the invisible reCAPTCHA data-callback, it expects a global function, so the solution i came up with is :

$scope.login = function (token) {
  // your login logic
}
$window.login = $scope.login;

then you can use data-callback="login" inside your login button.

hope this helps.

Chtioui Malek
  • 11,197
  • 1
  • 72
  • 69