reCAPTCHA 與 AEM Forms as a Cloud Service 適用的 Edge Delivery Services 搭配使用
reCAPTCHA 是一種受歡迎的工具,用來保護網站免遭詐騙活動、垃圾郵件和濫用。在 Edge Delivery Services 中,最適化 Forms 區塊有新增 Google reCAPTCHA 的功能,可區分人類和機器人。此功能可讓使用者保護其網站免遭垃圾郵件和濫用。
例如,考慮一個收集資料的查詢表單,例如開始和結束旅行日期、房間預算、預估旅行成本和旅行者資訊。在這種情況下,惡意使用者可能會利用該表單來發送網路釣魚電子郵件,或使用垃圾郵件機器人將不相關或有害內容填滿表單。整合 reCAPTCHA 可驗證提交內容是否來自真實使用者,以此提供更高的安全性並有效地減少垃圾郵件。
Edge Delivery Services 僅支援最適化表單區塊的 分數型 (v3)-reCAPTCHA。
閱讀完本文章後,您將學會:
必要條件
- 依照使用最適化表單區塊建立表單所述步驟,開始開發 Edge Delivery Services 表單。
- 註冊您的網域請使用 Google reCAPTCHA 並取得憑證。
為單一表單啟用 Google reCAPTCHA enable-google-recaptchas-for-a-single-form
為單一表單啟用 Google reCAPTCHA 涉及將 Google 的 reCAPTCHA 服務整合到特定網頁表單中,以防止自動化濫用或寄送垃圾郵件。
若要為單一表單啟用 Google reCAPTCHA:
若要開始在 Edge Delivery Services 表單中設定 reCaptcha,請參閱下列試算表,其中包括表單的表單定義。
在專案設定檔中設定 reCAPTCHA 祕密金鑰 configure-secret-key
將使用 Google reCAPTCHA 註冊的網域的 Site Secret 新增至專案設定檔 (.helix/config),其位於 Microsoft SharePoint 或 Google Drive 上的 AEM Project 資料夾中。若要將 Site Secret 新增至設定檔:
-
前往您儲存在 Microsoft® SharePoint 或 Google Drive 上的 AEM 專案資料夾。
-
在 Microsoft SharePoint 網站的 AEM 專案資料夾中建立
.helix/config.xlsx檔案,或在 Google Drive 的 AEM 專案資料夾中建立.helix/config檔案。note note NOTE 這個專案設定檔是試算表,位於 /.helix/config。如果檔案不存在,請建立檔案。 -
開啟
config檔案,並新增以下鍵值對:- captcha.secret:Google reCAPTCHA 密鑰值
- captcha.type:reCAPTCHA v2
note note NOTE - 您可以從 Google reCAPTCHA Admin Console 擷取 reCAPTCHA 金鑰。
- 您必須將
config檔案中 captcha.type 的值指定為 reCAPTCHA v2。
- 您必須將
請參考下方專案設定檔螢幕擷圖:
-
儲存
config檔案。 -
使用 AEM Sidekick 來預覽和發佈
config檔案。
將 reCAPTCHA 網站金鑰新增至您的表單中 add-site-key
使用 Google reCAPTCHA 註冊的網域的網站金鑰,將會新增到要保護的表單的試算表中。若要將網站金鑰新增至表單:
-
前往 Microsoft® SharePoint 或 Google Drive 的 AEM 專案資料夾,並開啟您的試算表。您也可以為表單建立新的試算表。
-
在試算表中插入一行以新增驗證碼的欄位,包括以下詳細資訊:
- 類型:驗證碼
- 值:Google reCAPTCHA 網站金鑰值
請參閱下方螢幕擷圖,顯示新一列類型為驗證碼的試算表:
note note NOTE 您可以從 Google reCAPTCHA Admin Console 擷取 reCAPTCHA 金鑰。 -
儲存試算表。
-
使用 AEM Sidekick 來預覽和發佈試算表。
在表單定義中新增一列後,表單右下角會出現一個 reCAPTCHA 徽章。這樣將確保該表單現在受到保護,避免詐騙活動、垃圾郵件和濫用的影響。
為網站上所有表單啟用 reCAPTCHA enable-recaptcha-for-all-the-forms
若要將 Google reCAPTCHA 套用至網站上使用自適應表單區塊的所有表單,請略過先前步驟並將 sitekey 值直接嵌入 recaptcha.js 檔案。若要將網站金鑰值加入 recaptcha.js 檔案:
更新 recaptcha.js 檔案中的 Google reCAPTCHA 網站金鑰
-
在本機電腦上開啟對應的 GitHub 存放庫。
-
前往
[../Form Block/integrations]資料夾並開啟recaptcha.js檔案。 -
用 Google reCAPTCHA 網站金鑰值取代
siteKey。
note note NOTE 您可以從 Google reCAPTCHA Admin Console 擷取 reCAPTCHA 金鑰。 -
儲存
recaptcha.js檔案。
部署檔案並建置專案
部署已更新的 recaptcha.js 檔案到您的 GitHub 專案,並驗證建置是否成功。