使用angularJs重新捕获Google数据回调

Question

我已经在我的angularjs App中实现了google Captcha。

我有这个HTML

<div class="g-recaptcha" data-sitekey="{{key}}" data-callback="enableBtn()"></div>

在我的控制器中，我有：

$scope.enableBtn = function(){
   $scope.captchaSigned = true;
};
$scope.key = "xyz";

但是没有工作，在我的控制台返回：

ReCAPTCHA couldn't find user-provided function: enableBtn()

如何使用Angularjs进行数据回调？

Answer 1

在你的html中：

<div class="g-recaptcha" data-sitekey="{{key}}" data-callback="enableBtn"></div>

在你的控制器中，放：

var enableBtn = function(){
   $scope.captchaSigned = true;
};
$scope.key = "xyz";
window.enableBtn = enableBtn;

这应该工作，因为它将绑定控制器中的函数。

Answer 2

我已经解决了这个库https://github.com/VividCortex/angular-recaptcha

Answer 3

在控制器中：

window.wrongCaptchaResponse = true;
window.recaptchaResponse = function(key) {
    window.wrongCaptchaResponse = false;
};

在HTML页面中：

<button type="submit" ng-disabled="loginForm.$invalid || wrongCaptchaResponse">Login</button>

Answer 4

您可以在角度控制器中初始化recaptcha。例如。

在控制器内部添加此按钮单击或初始化或超时（如果您在页面加载时需要它）。 ：

function showRecaptcha(){
	if(typeof grecaptcha !='undefined'){
		grecaptcha.render('register-recaptcha', {
	          'sitekey' : 'your_site_key',
	          'callback' : recaptchaCallback,
	        });
	}
}

function recaptchaCallback(resp){
	console.log(11,resp);
}

<div  id="register-recaptcha"></div>

Answer 5

而不是$scope.enableBtn = function(){定义你的功能为window.enableBtn = function(){

确保你使用data-callback="enableBtn"而不是data-callback="enableBtn()"