Blog

色々模索した結果PYPIを参考にしたら上手くいった。とはいえこれでちゃんと検証できているかは確認途中です…

クライアントサイド

headに追加

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

htmlに追加

<form id="contact-form" action="" method="POST">
    <!-- reCAPTCHA バッジと実行 -->
    <button class="button g-recaptcha" data-sitekey="xxxxxxxxxxxxxxxxxxxxxxx" data-callback='onSubmit' data-action='submit'>送信</button>
</form>

<script>
    function onSubmit(token) {
        document.getElementById("contact-form").submit();
    }
</script>

サーバーサイド

$pip install django-recaptcha

#forms.pyに追加

from django_recaptcha.fields import ReCaptchaField
from django_recaptcha.widgets import ReCaptchaV3

class FormWithCaptcha(forms.Form):
    captcha = ReCaptchaField(widget=ReCaptchaV3(action='contact'))

#settings.pyに追加
INSTALLED_APPS = [
    ...,
    'django_recaptcha',
    ...
]

#reCAPTCHAのキー
RECAPTCHA_PUBLIC_KEY = env('PUBLIC_KEY', default='')
RECAPTCHA_PRIVATE_KEY = env('PRIVATE_KEY', default='')
#スコア判定基準の設定
RECAPTCHA_REQUIRED_SCORE = 0.85