在通用編輯器中將 Google reCAPTCHA 新增到表單
Google reCAPTCHA 會區分人類使用者和自動機器人,能夠協助保護表單安全。 Edge Delivery Services Forms僅支援reCAPTCHA Enterprise搭配以分數為基礎的網站金鑰。 本指南說明如何在Universal Editor中為表單設定此保護。
目標:
- 使用以分數為基礎的網站金鑰設定reCAPTCHA Enterprise
- 將 reCAPTCHA 新增至您的表單
- 驗證並測試實施情況
- 監控和最佳化效能
先決條件
在開始之前,請確保您已具備以下條件:
存取要求
- AEM as a Cloud Service 製作存取權
- 具有表單編輯權限的通用編輯器存取權
技術要求
- 有效的 Google 帳戶
- 已啟用計費的Google Cloud Platform專案
- 已驗證表單的網域名稱所有權
知識要求
- 對 AEM Forms 和通用編輯器有基本的了解
- 熟悉雲端服務設定
- 理解表單安全性概念
為什麼要在表單中使用 reCAPTCHA?
reCAPTCHA Enterprise會評估使用者互動,協助保護表單免受垃圾郵件和自動化濫用。 Google會記錄下列功能:
定價、配額和支援:成本取決於Google服務層級和評估數量。 使用受限於的是Google的配額,而非無限制。 如需目前定價、訂閱需求及支援選項,請參閱Google的階層詳細資料。 Google列出其各階層的客戶支援,以及其企業階層的專用帳戶管理。
設定 reCAPTCHA 企業版
要求:
- 已啟用計費的 Google Cloud 專案
- 專案 ID (來自 GCP 儀表板)
- 表單的網域驗證
- 管理員對 GCP 和 AEM 的存取權
設定:
-
建立或選取 Google Cloud 專案
- 前往 Google Cloud Console
- 建立新專案或選取現有專案
- 記下您的專案 ID
-
啟用 reCAPTCHA 企業版 API
- 前往「API 和服務」>「資料庫」
- 搜尋「reCAPTCHA 企業版 API」
- 按一下「啟用」
-
建立 API 認證
- 前往「API 和服務」>「認證」
- 按一下「建立認證」>「API 金鑰」
- 複製並儲存您的 API 金鑰
-
建立網站金鑰
- 前往「安全性>詐騙防禦>金鑰」
- 按一下建立索引鍵,然後選取Web作為應用程式型別
- 新增您的網域
- 按一下「下一步」 (選用)以開啟其他設定
- 堅持住,你會使用挑戰嗎? 關閉以建立以分數為基礎的網站金鑰
- 按一下「建立金鑰」並複製網站金鑰
驗證查核點:確保您已有:
- 專案 ID
- API 金鑰
- 網站金鑰
- 在 Google Cloud 中已驗證的網域
圖:正在為您的表單容器啟用雲端設定
設定:
-
存取設定瀏覽器
- 登入您的 AEM 作者實例
- 前往「工具」>「一般」>「設定瀏覽器」。
-
啟用雲端設定
- 找到表單的設定容器
- 選取屬性
- 檢查雲端設定
- 按一下「儲存並關閉」。
-
檢查設定
- 確認容器屬性中出現「雲端設定」
驗證查核點:
- 為您的容器啟用雲端設定
- 容器出現在設定瀏覽器中
- 屬性顯示「雲端設定」已啟用
圖: AEM中的reCAPTCHA企業組態介面
設定:
-
存取 reCAPTCHA 設定
- 前往「工具」>「雲端服務」>「reCAPTCHA」
- 選取表單的設定容器
- 按一下「建立」
-
進行企業設定
- 標題:說明性名稱 (例如「生產 reCAPTCHA」)
- 名稱:系統名稱 (自動產生或自訂)
- 版本:選取 ReCAPTCHA 企業版
- 專案 ID:輸入您的 Google Cloud 專案 ID
- 網站金鑰:輸入來自 Google Cloud 的網站金鑰
- API 金鑰:輸入您的 Google Cloud API 金鑰
- 金鑰類型:選取分數型網站金鑰
-
設定安全性臨界值
-
臨界值分數:設定在 0.0 到 1.0 之間
-
建議值:
- 0.7-0.9:高安全性 (可能會阻止一些合法使用者)
- 0.5-0.7:平衡安全性 (建議)
- 0.1-0.5:較低安全性 (允許更多使用者)
-
-
儲存並發佈
- 按一下「建立」以儲存設定
- 按一下「發佈」以便開放使用
驗證查核點:
- 設定已成功儲存
- 已完成所有必填欄位
- 設定已發佈且可見
- 無錯誤訊息
將 reCAPTCHA 新增至您的表單
設定 reCAPTCHA 服務後,請按照以下方式為表單新增保護:
圖:正在新增不可見的驗證碼元件至您的表單
前往您在 AEM Sites 中的表單並按一下「編輯」,在通用編輯器中開啟表單。 等待編輯器載入。
- 前往您在 AEM Sites 中的表單
- 按一下「編輯」以便在通用編輯器中開啟
- 等待編輯器載入
在內容樹 (左側面板) 中,找到您的自適應表單區段並展開表單結構查看插入點。
- 在內容樹 (左側面板) 中,找到您的自適應表單區段
- 展開表單結構以查看插入點
將驗證碼 (隱形) 元件新增至您的表單。
- 按一下表單區段中的「新增」(+) 圖示
- 從元件清單中,選取驗證碼 (隱形)
- 或者,從元件面板拖放元件
選取新增的驗證碼元件並驗證其是否使用您的 reCAPTCHA 設定。
- 選取新增的驗證碼元件
- 在「屬性」面板中,驗證其是否使用您的 reCAPTCHA 設定
- 基本設定不需要額外設定
發佈您的變更並驗證其沒有錯誤。
- 在通用編輯器中按一下「發佈」
- 等待確認
- 確認沒有出現錯誤
確認實施
受保護的表單現在可從以下網址取得:
https://<branch>--<repo>--<owner>.aem.live/content/forms/af/
<form-name>
範例 URL:
https://main--my-forms--company.aem.live/content/forms/af/
contact-us-form