Comment mettre en place un simple reCaptcha avec django

Active 09 février 2018    /    Viewed 3004    /    Comments 0    /    Edit


L'objectif d'un captcha est de discriminer un visiteur humain d'un robot en mettant en place un test, simple à réaliser pour un humain mais relativement difficile pour une machine.

Il existe plusieurs types de captcha, ici on va voir un simple exemple basé sur reCaptcha de google. Le guide en anglais suivant est assez complet. La seule difficulté avec reCaptcha est la validation. En effet pour valider le captcha, à chaque utilisation par un visiteur, il faut faut envoyer une requête au site reCaptcha. Cependant avec python on peut réaliser cette étape facilement avec le module urllib comme indique dans le guide. (Note: pour installer reCaptcha en utilisant le php et javascript voir par exemple bootstrap recaptcha form tutorial),

La première étape consiste à aller sur la page google reCaptcha, se connecter avec son compte google (ou en créer un nouveau), puis de compléter les deux formulaires apparaissant dans les deux images ci-dessous:

Comment mettre en place un simple reCaptcha avec django

Ici on va choisir reCaptcha v2, puis entrer dans le champ intitulé label: Contact Form, et dans domaine par exemple: mon_site.com (et 127.0.0.1 si vous voulez tester localement sur votre machine). Une fois cette étape terminée on obtient une clé secrete et une clé publique. La clé secrete peut par exemple (Note: pour augmenter la sécurité voir par exemple ce lien) se place dans le fichier settings.py comme ceci:

 GOOGLE_RECAPTCHA_SECRET_KEY = 'secret_key_here'

model.py:

class Contact_Form(forms.Form):
    subject = forms.CharField(max_length=1000) 
    content = forms.CharField(required=False)
    email = forms.CharField(max_length=1000, required=False)

template html contact.html (remplacer public_key_here par votre clé publique):

<form action="/Contact-US/" method="post">

{% csrf_token %}

<input type="text" name="subject">

<textarea name="content" rows="20"></textarea>

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

 <div class="col-md-12">
     <div class="g-recaptcha" data-sitekey="public_key_here"></div>
 </div>

<input type="submit" value="Send your message">

</form>

et views.py

import urllib

def Message_Create_View(request):
    contact_form = Contact_Form()
    if request.method == 'POST':
        form = Contact_Form(request.POST)
        if form.is_valid():
            #----- form -----#
            subject = request.POST['subject']
            content = request.POST['content']
            name = request.POST['name']
            email = request.POST['email']
            recaptcha_response = request.POST.get('g-recaptcha-response')
            #---- captcha -----#
            url = 'https://www.google.com/recaptcha/api/siteverify'
            values = {
                'secret': settings.GOOGLE_RECAPTCHA_SECRET_KEY,
                'response': recaptcha_response
            }
            data = urllib.parse.urlencode(values).encode()
            req =  urllib.request.Request(url, data=data)
            response = urllib.request.urlopen(req)
            result = json.loads(response.read().decode())
            #---- process data  -----#
            if result: # if captcha is successful 
                # do soemthing
            else:
                # do soemthing              
    context = {'contact_form':contact_form}
    return render(request, "my_app/Contact.html", context)

Exemple de résultats (mise en forme avec bootstrap):

recaptcha-django-01

Références

Liens Site
reCaptcha google
How to Add reCAPTCHA to a Django Site simpleisbetterthancomplex
Easy-to-use django captcha or registration app with captcha? stackoverflow
bootstrap recaptcha form tutorial bootstrapious


Card image cap
profile-image
Daidalos

Hi, I am Ben.

I have developed this web site from scratch with Django to share with everyone my notes. If you have any ideas or suggestions to improve the site, let me know ! (you can contact me using the form in the welcome page). Thanks!