Como colocar o recaptcha em um item de catálogo ou Record Producer

Guilherme B · ‎03-03-2024

Olá Pessoal!

Basicamente nessa solução vamos criar um campo oculto dentro do item de catálogo que será validado como true/yes por um client script e só poderá submeter o formulário após ter validado o recaptcha.

Lembrando que atualmente é suportado o recaptcha V2.

Para fazer isso será preciso seguir os seguintes passos:

> Criar um item de catálogo, adicionando uma váriavel Yes/No com nome Recaptcha(ID:captcha_verification), e deixando ele oculto. Além disso deixar ativado a opção "Incluir nenhum".

> Criar uma váriavel na tabela sys_properties com o nome "recaptcha.site-key" e adicionar na opção value a chave secreta do recaptcha.

> Criar o widget do recaptcha(Widget Público):

Body HTML Template:

<body>
<script src="https://www.google.com/recaptcha/api.js"></script>
<div class="g-recaptcha" data-callback="captchaCallback" data-sitekey="{{data.sitekey}}"></div>
<input type="text" style=" display: none;"id="myText" name="message" ng-model = "c.message" ng-change="changelink()">
</body>
<script type="text/javascript">
function captchaCallback() {
var resp = grecaptcha.getResponse();
if(resp){
document.getElementById("myText").value = "true";
var element = document.getElementById('myText');
var event = new Event('change');
element.dispatchEvent(event);
}
}
</script>

Server Script:

(function() {
/* populate the 'data' object */
/* e.g., data.table = $sp.getValue('table'); */
data.sitekey = gs.getProperty('recaptcha.site-key');
})();

Client Controller:

api.controller=function($scope,spUtil) {
/* widget controller */
var c = this;

$scope.changelink = function() {
$scope.page.g_form.setValue('captcha_verification','Yes');

};
};

> Criar um catalog Client Script OnSubmit que validará o campo com "Yes"(UI Type: All):

function onSubmit() {
//Type appropriate comment here, and begin script below
if (g_form.getValue('captcha_verification') != "Yes") {
alert("Please verify that you are not a robot.");

return false;
}
}

Espero ter ajudado!

Qualquer coisa comentem aqui!