reCAPTCHA v2 使用範例

---

---

方法1：直接埋 HTML code

參考文件：Automatically render the reCAPTCHA widget

code

<!-- 放置驗證器 -->
<div
    class="g-recaptcha"
    data-sitekey="網站金鑰"
    data-theme="light" data-size="normal"
    data-callback="verify"
    data-expired-callback="expired"
    data-error-callback="error">
</div>

<-- 引用 JS -->
<script src="https://www.google.com/recaptcha/api.js" async defer></script>

• class 必須為「g-recaptcha」
• data-sitekey，填入「網站金鑰」
• data-theme，亮色或深色樣式：dark、light。預設是 light
• data-size，大小：compact、normal。預設是 normal
• data-callback，驗證完成後要觸發哪個 function，會回傳 g-recaptcha-response token
• data-expired-callback，當驗證過期後會觸發哪個 function
• data-error-callback，當驗證失敗時會觸發哪個 function

產出範例

驗證成功才會出現的按鈕

驗證成功！

---