Добавляем api на страницу
document.addEventListener("DOMContentLoaded", () => {
if (typeof grecaptcha === "undefined") {
let script = document.createElement('script');
script.src = 'https://www.google.com/recaptcha/api.js?&render=explicit';
script.onload = renderWait;
script.setAttribute('async', '');
script.setAttribute('defer', '');
document.body.append(script);
} else {
render();
}
function renderWait() {
setTimeout(() => {
if (typeof grecaptcha !== "undefined" && typeof grecaptcha.render !== "undefined") {
render();
} else {
renderWait();
}
}, 200);
}
function render() {
window.GR_V2_SITEKEY = "<?= GR_V2_SITEKEY;?>";
console.info('КЛЮЧ:', GR_V2_SITEKEY);
}
});
Добавлям в форму <div id="g-recaptcha" data-size="invisible"></div>
form.addEventListener("submit", function(e) {
let _this = this;
let widget = null;
if (_th.checkForm(form)) {
// console.log('заполнено');
event.preventDefault();
widget = grecaptcha.render(_this.querySelector('#g-recaptcha'), {
sitekey: GR_V2_SITEKEY,
callback: response => {
// console.log("FORM FEEDBACK | RESPONSE | PAGE ", response);
if (response) {
// console.log('капча пройдена успешно')
t(_this);
grecaptcha.reset(widget)
_this.querySelector('#g-recaptcha').remove();
_this.insertAdjacentHTML('afterbegin', '<div id="g-recaptcha" data-size="invisible"></div>');
widget = null;
} else {
// console.log('капча не пройдена')
event.preventDefault();
}
}
});
grecaptcha.execute(widget);
} else {
// console.log('не заполнено');
event.preventDefault();
}
}, true);