目前在登录页面,我需要在同一页上进行得分和复选框reCaptcha评估,如果得分失败,我需要动态加载复选框得分。
目前已经实现了这个功能,但是我不确定我是否正确地实现了它。
在我的HTML头部中,我有:
<script src="https://www.google.com/recaptcha/enterprise.js?render=${Login.reCaptchaScoreKey}"></script>
而在HTML主体中,我有:
<script src="https://www.google.com/recaptcha/enterprise.js?render=explicit"></script>
使用AJAX加载复选框的代码如下:
var captchaContainer = grecaptcha.render('captcha_container', {
'sitekey' : siteKey,
'callback' : function() {
$("#LOGIN").prop('disabled', false);
}
});
为了提交分数,我需要执行以下操作(我将 reCaptcha 生成的令牌附加到一个 HTML 元素上,因为这是我能想到的唯一发送到后端的方法):
grecaptcha.enterprise.ready(function() {
grecaptcha.enterprise.execute(scoreKey, {action: action}).then(function(token) {
$('#g-recaptcha-response').val(token);
submitForm();
});
});
似乎很奇怪,我需要两次包含reCaptcha JS文件才能使它正常工作,这有点像是一种代码异味。如果我删除第一个JS文件,我的分数reCaptcha将会出现问题,如果我删除第二个JS文件,复选框将会出问题。
有没有一种方式可以只包含一次reCaptcha JS来实现我想要的功能?或者我的做法还可以吗?