如何将 TarteAuCitron (RGPD / ePR) 与 ContactForm7 集成的 reCAPTCHA 一起使用？

Question

我在客户的网站上使用脚本 tarteaucitron.js 来管理第三方 cookie 和脚本。该网站由 WordPress 驱动。

我们使用 ContactForm7 扩展创建了一个联系表单，并集成了 reCAPTCHA。

我想让 TarteAuCitron 处理 reCAPTCHA 脚本，而不是让 ContactForm7 加载它。我知道 TarteAuCitron 能够加载 reCAPTCHA，但我不知道如何将它与 ContactForm7 设置和 WordPress 脚本系统结合使用。

Answer 1

我找到了一种方法。在 WordPress 操作挂钩 (wp_footer) 中，我将联系表 7 入队的 reCAPTCHA 脚本出列。然后插入自定义 TarteAuCitron 服务和服务调用（reCAPTCHA v2 和 v3 不同），然后是联系表 7 bootstrap 脚本：

// remove recaptcha script
wp_dequeue_script('google-recaptcha');

// enqueue recaptcha service
// $service contains the definition script of the TarteAuCitron service named 'recaptchacf7'
wp_add_inline_script('tarteaucitron', $service, 'after');

// enqueue service call
wp_add_inline_script('tarteaucitron', '(tarteaucitron.job = tarteaucitron.job || []).push("recaptchacf7");', 'after');

使用 reCAPCHA v3，棘手的部分是检索 Contact Form 7 bootstrap 脚本，该脚本未以标准方式排队，而是在 wp_footer 操作期间简单编写。我们需要防止它立即插入，并将其插入服务定义脚本中，以便在网站用户选择启用它时稍后激活。我是在 ob_start() 和 ob_get_clean() PHP 函数的帮助下完成的：

if (function_exists('wpcf7_recaptcha_onload_script')) {
    array_push(wp_scripts()->done, 'google-recaptcha');
    ob_start();
    wpcf7_recaptcha_onload_script();
    $bootstrap = preg_replace('/<\/?script[^>]*>/', '', ob_get_clean());
    array_pop(wp_scripts()->done);
}

我将代码封装在一个 WordPress 插件中，可以在这里找到：cf7-tac-recaptcha。它包括 reCAPTCHA v2 和 v3 的服务定义脚本。没有什么要配置的了。