将 reCAPTCHA 与 AEM Forms as a Cloud Service 的 Edge Delivery Services 结合使用

reCAPTCHA 是一种流行的工具,用于保护网站免受欺诈活动、垃圾邮件和滥用。在 Edge Delivery Services 中,自适应表单块提供了添加 Google reCAPTCHA 的功能,以区分人类和机器人。此功能允许用户保护他们的网站免受垃圾邮件和滥用。
例如,考虑一个收集旅行开始和结束日期、房间预算、预计旅行费用和旅行者信息等数据的查询表。在这种情况下,存在恶意用户利用该表单发送网络钓鱼电子邮件或使用垃圾邮件机器人向其中发送不相关或有害内容的风险。集成 reCAPTCHA 可验证提交内容是否来自真实用户,从而提供额外的安全性,有效减少垃圾邮件条目。

Edge Delivery Services 仅支持 基于分数的(v3)-reCAPTCHA 用于自适应表单块。Edge Delivery Services 仅支持自适应表单块的基于分数的 (v3) reCAPTCHA。

Recaptcha V2 {align="center" width="300"}

读完本文后,您将学会:

先决条件

为单个表单启用 Google reCAPTCHA enable-google-recaptchas-for-a-single-form

为单个表单启用 Google reCAPTCHA 涉及将 Google 的 reCAPTCHA 服务集成到特定的 Web 表单中,以防止自动滥用或垃圾邮件提交。

为单个表单启用 Google reCAPTCHA:

要开始在 Edge Delivery Services Forms 中配置 reCaptcha,请参阅以下包含表单的表单定义的电子表格

在项目配置文件中配置reCAPTCHA密钥 configure-secret-key

使用 Google reCAPTCHA 注册的域的站点机密被添加到 Microsoft Sharepoint 或 Google Drive 上的(.helix/config)AEM 项目文件夹中的项目配置文件。要将站点机密添加到配置文件:

  1. 转到 Microsoft® SharePoint 或 Google Drive 上的 AEM 项目文件夹。

  2. 创建 .helix/config.xlsx Microsoft SharePoint 站点中的 AEM 项目文件夹中的文件或 .helix/config Google 驱动器内的 AEM 项目文件夹中的文件。

    note note
    NOTE
    项目配置文件 电子表格位于 /.helix/config。如果该文件不存在,则创建它。
  3. 打开 config 文件并添加以下键和值对:

    • 验证码密码:Google reCAPTCHA 密钥值
    • 验证码类型: reCAPTCHA v2
    note note
    NOTE

    请参阅下面的项目配置文件截图:

    项目配置文件

  4. 保存 config 文件。

  5. 使用 AEM Sidekick预览和发布文件config

将 reCAPTCHA 站点密钥添加到您的表单中 add-site-key

使用 Google reCAPTCHA 注册的域名的站点密钥被添加到要保护的表单的电子表格中。要将站点键添加到表单:

  1. 转到 Microsoft® SharePoint 或 Google Drive 上的 AEM Project 文件夹并打开电子表格。您还可以为表单创建新的电子表格。

  2. 在电子表格中插入一行以添加新字段作为 CAPTCHA,包括以下详细信息:

    • 类型:验证码
    • 价值:Google reCAPTCHA 站点密钥值

    请参阅下面的屏幕截图,其中描绘了新行类型为 CAPTCHA 的电子表格:

    Recaptcha 电子表格

    note note
    NOTE
    您可以从 Google reCAPTCHA 管理控制台检索 reCAPTCHA 密钥。
  3. 保存电子表格。

  4. 使用 AEM Sidekick 预览和发布工作表。

在表单定义中添加新行后,表单的右下角会出现一个 reCAPTCHA 徽章。这确保了表单现在受到保护,免受欺诈活动、垃圾邮件和滥用。

recaptcha 表单

为您网站上的所有表单启用 reCAPTCHA enable-recaptcha-for-all-the-forms

要将 Google reCAPTCHA 应用于您网站上使用自适应表单块的所有表单,请跳过前面的步骤并直接将 sitekey 值嵌入到 recaptcha.js 文件中。在 recaptcha.js 文件中包含站点密钥值:

在 recaptcha.js 文件中更新 Google reCAPTCHA 站点密钥

  1. 在本地机器上打开相应的 GitHub 存储库。

  2. 导航 [../Form Block/integrations] 文件夹并打开 recaptcha.js 文件。

  3. 更换 siteKey 带有Google reCAPTCHA 站点密钥值。

    Recaptcha 适用于所有表格

    note note
    NOTE
    您可以从 Google reCAPTCHA 管理控制台检索 reCAPTCHA 密钥。
  4. 保存 recaptcha.js 文件。

部署文件并构建项目

将更新后的recaptcha.js文件部署到您的 GitHub 项目并验证是否成功构建。

使用 AEM Sidekick 预览站点

使用 AEM Sidekick 预览和发布网站。

reCAPTCHA 徽章开始出现在您网站上的所有表格上。

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab