Comment mettre en place un simple reCaptcha avec django

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:

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):

Références