We may face issues when someone uses bots to abuse our system and send automated signup/password reset to random people. So hCaptcha is a really good way to avoid bots.
Setting Up hCaptcha account
- First we need new hCaptcha account. If you don't have an account, then create one at https://dashboard.hcaptcha.com/signup.
- After that you need to go on your hCaptcha dashboard's sites page at https://dashboard.hcaptcha.com/sites.
- Then create a new site, you can name it anything you want. After that click on the settings icon next to the site you created. You will see a site key. Copy it and keep it someone.
- Go to your account settings at https://dashboard.hcaptcha.com/settings and then copy and keep the secret key.
Installing hCaptcha
We will be using django-hCaptcha package from pypi.
- Install it using the following command
pip install django-hCaptcha
- Add “hcaptcha” to your INSTALLED_APPS setting like this:
# project/settings.py
INSTALLED_APPS = [
...
'hcaptcha',
]
- Addsitekey and secret key which we kept earlier to your settings.py file
# project/settings.py
...
HCAPTCHA_SITEKEY = '<your sitekey>'
HCAPTCHA_SECRET = '<your secret key>'
...
Add hCaptcha to forms
- Extend default allauth forms
I referred to this article by geeksforgeeks for the same:
https://www.geeksforgeeks.org/python-extending-and-customizing-django-allauth/
- Make forms.py file in any django app folder
# app/forms.py
from allauth.account.forms import SignupForm, ResetPasswordForm
from hcaptcha.fields import hCaptchaField
class CustomSignupForm(SignupForm):
hcaptcha = hCaptchaField(theme='dark')
# if the order of fields isn't as you expected ,then you can use field_order
#field_order = ['username', 'email', 'password1', 'password2', 'hcaptcha']
#customize this according to your form
class CustomForgetPassword(ResetPasswordForm):
hcaptcha = hCaptchaField(theme='dark')
- Make these as the default forms by declaring them in settings.py file
# project/settings.py
...
ACCOUNT_FORMS = {
'signup': '<app>.forms.MyCustomSignupForm',
'reset_password': '<app>.forms.CustomForgetPassword',}
...
Top comments (0)