使用 reCAPTCHA v3 做表單送出驗證

相信大家在看到使用者填資料時，都有看過出現要你輸入驗證碼，或是勾選「我不是機器人」這樣選項的東西，這個 google 本身有提供一個服務叫做 reCAPTCHA 就可以簡單做到，而現在最新的 v3 版甚至不用去勾選「我不是機器人」就可以幫你驗證了。

使用方法也很簡單，首先先到 reCAPTCHA v3 Admin 這邊設定。

按下 + 的按鈕在設定網站就好了。

設定完後會看到一個這樣的內容，把網站金鑰複製起來。

接著照以下步驟：

1. 讀入  javascript API

 <script src="https://www.google.com/recaptcha/api.js"></script>

2. 設定  callback function

function onSubmit(token) {
     document.getElementById("demo-form").submit();
   }

這裡的 demo-form 要換成你的表單 id

3. 把送出的按鈕改成這樣：

<button class="g-recaptcha" 
        data-sitekey="reCAPTCHA_site_key" 
        data-callback='onSubmit' 
        data-action='submit'>Submit</button>

這邊就是把 reCAPTCHA_site_key 換成你的網站金鑰。

這樣就完成了，成功完成時會在右下角看到一個 reCAPTCHA 的 icon，在你送出時 reCAPTCHA 就會幫你檢查了。

更多設定可以看官方文件說明。