Apprenez à construire une application web dans Django qui vérifie les adresses e-mail à l’aide du validateur de courrier électronique dans Python.
La vérification de l’adresse électronique est un processus qui implique la confirmation de l’authenticité ou de la légitimité d’une adresse électronique. Aujourd’hui, les entreprises intègrent la vérification par courrier électronique dans leurs opérations quotidiennes, ce qui s’est avéré plus efficace car cela les aide à ne conserver que les adresses électroniques des clients qui soient valides et accessibles.
Il y a des tonnes de services de vérification d’adresses e-mail sur Internet, mais tout cela a un coût, mais la bonne nouvelle est que vous pouvez construire votre propre outil pour cette tâche gratuitement avec l’aide de Django et de paquets de validation de courrier électronique. Dans cet article, vous apprendrez comment construire votre propre vérificateur d’adresses e-mail basé sur le web à partir de zéro, donc avec cela dit, plongeons-nous.
À la fin de cet article, vous pourrez construire une application qui ressemble à ceci:
Démarrage
Commençons par créer un environnement virtuel pour le projet; nous utiliserons cette commande:
$ python -m venv project
Pour activer l’environnement virtuel, utiliser:
$ .\project\Scripts\activate
Ayant créé et activé l’environnement virtuel, installons maintenant les dépendances requises pour ce projet; nous allons les installer en une seule fois, alors utiliser:
$ pip install django email-validator
Création du projet principal et de l’application
Maintenant que la mise en place de l’environnement du projet est prise en compte, nous devrions créer le principal projet de Django, qui s’inscrit maintenant
$ django-admin startproject webbased_emailverifier
Puis cd dans le webbased_emailverifier
folder, avec cette commande:
$ cd webbased_emailverifier
À l’intérieur webbased_emailverifier
folder, exécuter cette commande:
$ python manage.py startapp verifier
Cela créera l’application du vérificateur. Après tout cela, assurez-vous d’avoir la structure de dossier suivante pour le projet:
Le verifier
le dossier est l’application, le webbased_emailverifier
le dossier est le projet principal et le manage.py
fichier est un script qui nous aide à exécuter les ordres administratifs Django comme le startapp
, runserver
, etc.
Avant de nous déplacer plus loin, testons si Django était installé avec succès, pour rouler le serveur local Django, exécutez la commande :
$ python manage.py runserver
Si le serveur fonctionne avec succès, collez l’URL http://127.0.0.1:8000/ dans votre navigateur web et assurez-vous d’obtenir cette sortie dans le navigateur:
Cela signifie que Django a été installé avec succès, et nous sommes bons pour aller de l’avant.
Enregistrement de la demande dans le settings.py
Fichier
Notre application verifier
n’est pas encore connue par le projet principal, nous devons donc l’enregistrer. Pour ce faire, ouvrez le settings.py
dossier situé à l’intérieur du webbased_emailverifier
:
Et faites défiler vers le bas jusqu’à ce que vous trouviez le INSTALLED_APP
, et l’éditer pour qu’il ressemble à ceci:
# Définition de l'application
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
#l'application nouvellement créée
'verifier',
]
Le fichier settings.py
est un fichier important pour le projet car il est responsable de toutes les configurations du projet, alors soyez très prudent lors de son édition parce qu’une ligne de code désordonnée pourrait briser l’ensemble du projet.
Création de la vue principale pour l’application dans le fichier views.py
Nous allons maintenant créer la vue pour l’application et ouvrir le views.py
qui se trouve à l’intérieur du dossier verifier
:
Le fichier views.py
gère toute la logique de l’application, comme la capture et la validation des données à partir de formulaires, la réalisation d’appels de demandes d’API et l’authentification des utilisateurs.
Ouvrez-le et collez ces lignes de code:
from django.shortcuts import render
from django.http import HttpResponse
#Créez vos vues ici.
def index(request):
return HttpResponse('This is the Index page!!')
Dans l’extrait de code, nous importons la fonction HttpResponse() de django.http, cette fonction sert uniquement à faire écho aux réponses du navigateur à l’utilisateur. Vous en apprendrez plus sur la fonction render() plus loin dans l’article.
Configuration des URL pour l’application
Créons maintenant les URL de l’application. Créer un urls.py
à l’intérieur du dossier verifier
comme suit:
Ce fichier est destiné à enregistrer les points de vue de l’application; assurez-vous de le nommer urls.py
et pas autrement, c’est la convention de Django.
Ouvrez-le et collez le code suivant:
#à partir des vues d'importation du dossier actuel
from views import index
#importation du chemin depuis Django.urls
from django.urls import path
#voici la liste des vues de l'application
#si l'application a plusieurs vues alors elle aura plusieurs chemins
urlpatterns = [
path('', index, name='home'),
]
Dans le fichier, nous importons la vue index() à partir du fichier vues.py. Après les importations, nous créons une liste appelée urlpatterns, qui contiendra un chemin URL, et si l’application a plusieurs vues, alors les urlpatterns contiendront plusieurs chemins URL. Si vous remarquez, la fonction path() prend trois arguments, le chemin réel sous forme de chaîne vide, la vue et le nom de la vue.
Faisons maintenant connaître l’URL de l’application au projet, ouvrons le dossier webbased_emailverifier et ouvrons le fichier urls.py :
Il convient de mentionner ici que le fichier urls.py de l’application n’est pas le même que le fichier urls.py du projet. Le fichier urls.py dans le dossier verifier sert à enregistrer toutes les vues de l’application et le fichier urls.py à l’intérieur du dossier webbased_emailverifier sert à enregistrer toutes les URL des applications. Si le projet comporte par exemple cinq applications, alors toutes les URL de ces applications seront enregistrées dans le fichier urls.py du projet.
Ouvrez-le et collez ce code:
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
#cela pointe vers les URL du site admin.site
path('admin/', admin.site.urls),
#cela pointe vers les URL du vérificateur
path('', include('verifier.urls')),
]
Décomposons un peu le code pour que nous soyons sur la même longueur d’onde. Nous créons une liste de modèles d’URL avec deux fonctions path(), la première pointe vers les URL du site d’administration par défaut et la seconde vers les URL de l’application de vérification en utilisant via la fonction include().
Il est maintenant temps de tester si toutes les configurations que nous avons effectuées fonctionnent. Assurez-vous que le serveur est en cours d’exécution ; juste au cas où il s’arrêterait, redémarrez-le. Maintenant, dans votre navigateur Web, accédez à cette URL http://127.0.0.1:8000/ ; le résultat ressemblera à ceci :
Tout semble fonctionner parfaitement.
Création et mise en page de modèles
Nous allons maintenant porter notre attention sur la création de la partie fron-tend de l’application. Nous utiliserons HTML et Bootstrap5 à des fins de style. Créons les modèles pour l’application dans le dossier du vérificateur.
Créez un dossier appelé templates, et dans ce dossier templates, créez un autre dossier appelé verifier, c’est la façon de faire de Django.
Cette application aura deux modèles base.html et index.html, et ils seront situés dans le dossier du vérifier nouvellement créé :
Tout d’abord, ouvrez le base.html
et coller le code suivant:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Web-based Email Verifier</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body style="background-color:rgb(248, 244, 244)">
{% block content %}
{% endblock %}
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
Il s’agit d’un fichier standard HTML, auquel Bootstrap5 CSS et JavaScript sont ajoutés via les balises de lien et de script, respectivement. JavaScript ajoutera de l’interactivité dans le front-end.
Le modèle index.html héritera de tout du modèle base.html, c’est pratique car cela nous fait gagner du temps car nous ne répéterons pas le code, le rendant ainsi propre. Ouvrez le modèle index.html et collez ce code :
<!-- extends is for inheriting from the base.html -->
{% extends 'verifier/base.html' %}
{% block content %}
<div class="row justify-content-center my-5">
<div class="col-md-5 mt-4">
<div class="card">
<h3 class="card-header">Email Verifier</h3>
<div class="card-body">
<form action="." method="POST">
{% csrf_token %}
<div class="input-group">
<input type="text" required class="form-control" name="email-address" placeholder="Enter an email address to verify it">
<div class="input-group-append">
<button class="btn btn-primary fw-bold" type="submit">
Verify
</button>
</div>
</div>
</form>
<hr>
{% if messages %}
{% for message in messages %}
{% if message.tags == 'success' %}
<div class="alert alert-{{ message.tags }} alert-dismissible fade show" role="alert">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check-circle-fill" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg> {{ email }} is a valid email address!!!!!
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
{% elif message.tags == 'warning' %}
<div class="alert alert-danger alert-dismissible fade show" role="alert">
{{ email }}
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-exclamation-triangle-fill" viewBox="0 0 16 16">
<path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
</svg> {{ message }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
{% endif %}
{% endfor %}
{% endif %}
</div>
</div>
</div>
</div>
</div>
{% endblock %}
Pour que le modèle index.html hérite du modèle base.html, nous utilisons :
{% extends 'verifier/base.html' %}
Ce modèle est destiné à afficher les résultats de vérification du formulaire et de l’adresse e-mail. A l’intérieur de la forme, nous avons ce code:
{% csrf_token %}
Puisque le formulaire utilise la méthode POST, nous utilisons csrf_token
pour le sécuriser lors de la soumission de toute forme d’attaque malveillante.
Après avoir créé tous les modèles, il est maintenant temps de les afficher dans le navigateur, d’ouvrir le fichier views.py et de modifier la fonction index() pour qu’elle ressemble à ceci :
def index(request):
return render(request, 'verifier/index.html')
Ici, nous avons remplacé la fonction HttpResponse() par la fonction render(), cette fonction est destinée au rendu des modèles et prend deux arguments, la requête et le modèle réel.
Voyons maintenant un premier aperçu de l’application. Visitez à nouveau l’URL par défaut et si vous actualisez la page, vous obtiendrez ce résultat :
Félicitations pour la conception de l’avant-garde de l’application
Vérification des adresses électroniques
Dans cette dernière partie de l’article, nous mettrons en œuvre la fonctionnalité de vérification de l’adresse e-mail. Pour ce faire, ouvrez le views.py
et faire ressembler à ceci:
from django.shortcuts import render
#cela affiche des messages flash ou des notifications
from django.contrib import messages
#importation de validate_email et EmailNotValidError
from email_validator import validate_email, EmailNotValidError
#Créez vos vues ici.
def index(request):
#vérifier si la méthode est POST
if request.method == 'POST':
#obtenir l'e-mail à partir de la saisie du formulaire
email = request.POST.get('email-address')
#c'est le contexte
context = {
'email': email
}
#l'instruction try pour vérifier/valider l'e-mail
try:
#valider l'adresse e-mail réelle à l'aide de la fonction validate_email
email_object = validate_email(email)
#créer le message et le stocker
messages.success(request, f'{email} is a valid email address!!')
#rendre les résultats sur la page d'index
return render(request, 'verifier/index.html', context)
#l'instruction except capturera l'erreur EmailNotValidError
except EmailNotValidError as e:
#créer le message et le stocker
messages.warning(request, f'{e}')
#rendre l'erreur sur la page d'index
return render(request, 'verifier/index.html', context)
#cela sera rendu lorsqu'il n'y a pas de demande POST ou après chaque demande POST
return render(request, 'verifier/index.html')
Dans l’extrait de code, nous importons la fonction render(), comme d’habitude, nous importons également les messages Django intégrés depuis django.contrib, c’est pour afficher les messages flash ou les notifications, et enfin, nous importons validate_email et EmailNotValidError de email_validator. Selon la documentation de email-validator, il indique que la bibliothèque valide qu’une chaîne est de la forme name@example.com.
Dans la fonction index(), nous vérifions si la requête envoyée est POST. Si tel est le cas, nous récupérons l’e-mail à partir des données du formulaire à l’aide de request.POST.get(’email-address’), l’adresse e-mail est le nom donné à l’e-mail saisi dans le formulaire.
Après avoir mis l’e-mail dans le contexte, nous avons un bloc try/except, dans l’instruction try, nous validons l’adresse e-mail à l’aide de la fonction validate_email(), après une validation réussie, nous créons un message de réussite et appelons la fonction render() . Dans le bloc except, nous captons simplement l’EmailNotValidError, nous créons également un message, mais cette fois il est de type avertissement, et nous appelons à nouveau la fonction render().
Avant ou après une requête POST, nous souhaitons toujours afficher le formulaire afin que la fonction render() après le bloc try/except le fasse pour nous.
Essayons l’application, fournissons une adresse e-mail valide et vérifions-la en cliquant sur le bouton de vérification ; le résultat que vous obtiendrez est le suivant :
Remarque: l’application peut détecter de nombreuses erreurs; cet article ne les a pas toutes épuisées, mais vous pouvez essayer vous-même de comprendre ce qu’elles sont.
Conclusion
C’est tout ce qui ressort de cet article ; nous espérons que vous avez appris beaucoup de choses et que les connaissances que vous avez acquises seront appliquées dans vos futurs projets Django. Cet article vous a guidé tout au long du processus de création d’un vérificateur d’adresses e-mail basé sur le Web à l’aide du framework Django et du package email-validator. Cela peut être un outil utile en entreprise pour prévenir les abus d’adresses e-mail et garantir que seules des adresses e-mail valides sont utilisées.