Un guide pour créer une application de raccourcissement d'URL avec Django

La meilleure façon d'apprendre Django, ou n'importe quelle compétence, est d'appliquer les connaissances que vous avez en créant des projets fonctionnels.

Django est le framework de développement Web Python le plus utilisé. Ses fonctionnalités intégrées et sa grande quantité de packages tiers en ont fait l'un des frameworks Web les plus appréciés au monde.

Il est rapide, fiable et possède de nombreuses fonctionnalités intégrées. Par exemple, un système d'authentification de trous, qui vous permet de vous concentrer sur les principales fonctionnalités de votre application. En outre, vous pouvez installer des packages externes pour accomplir des tâches encore plus complexes, comme Django-allauth , qui vous permet d'enregistrer les utilisateurs avec leurs comptes sociaux.

Mais exposons quelques faits. Django est un framework tellement énorme qu'il est parfois difficile de le démarrer.

Aujourd'hui, vous allez donc créer à partir de zéro une application Django totalement fonctionnelle.

À la fin de ce didacticiel, vous allez :

• Avoir écrit une application de raccourcissement d'URL
• Comprendre le modèle Django MVT
• Avoir appris le workflow de création d'un projet

Pré-requis

Toutes les exigences suivantes sont facultatives et vous aideront à suivre le didacticiel. Mais si vous n'avez aucune expérience avec l'un d'entre eux, ne vous inquiétez pas. L'étape la plus importante est la première.

• Compréhension de base des commandes UNIX (ls, cd, rm, touch)
• Compréhension de base des classes et fonctions Python
• Python installé sur votre ordinateur (Peut-être évident mais je devais l'inclure)
• Ce serait génial si vous avez déjà construit quelque chose avec Django

Tout le code de travail sera disponible sur ce référentiel Github.

Maintenant que vous avez parfaitement compris les concepts précédents, entrons dans le vif du sujet.

Énoncé du projet

Dans ce didacticiel, vous allez créer un raccourcisseur d'URL. Fondamentalement, un raccourcisseur d'URL est un service qui prend une longue URL et la transforme en une URL compacte.

Par exemple, si vous souhaitez partager un tweet et inclure un lien vers votre site Web, mais que vous êtes confronté à la limite de caractères, vous pouvez utiliser un raccourcisseur d'URL.

Voyons cela avec un graphique.

Comme vous pouvez le voir, le raccourcisseur d'URL obtient une URL longue et renvoie une URL courte. C'est exactement ce que vous allez construire aujourd'hui.

Avec ce projet, vous pratiquerez l'utilisation du modèle MVT, apprendrez les bases de la conception de bases de données avec des modèles Django et apprendrez à montrer des informations à l'utilisateur via des vues, des URL et des modèles.

Structure d'un projet Django

Fondamentalement, un site Web Django est construit sur un seul projet et plusieurs applications séparées. Chacune de ces applications a des fonctionnalités spécifiques et est capable de fonctionner par elle-même.

Imaginons une application web complexe comme Stackoverflow. Sa fonctionnalité repose sur deux aspects principaux.

• Gestion des utilisateurs : connexion, déconnexion, réputation, autorisations
• Forum : Questions, réponses, tags, filtres

Ainsi, en suivant la structure du site Web de Django, le projet s'appellerait StackOverflow et aurait deux applications principales. L'application des utilisateurs et l' application du forum .

Chacune de ces applications a une fonctionnalité autonome. Cela signifie que les deux contiennent tout le code dont ils ont besoin pour fonctionner correctement.

Cela inclut des modèles (structure de base de données), des vues (requêtes et réponses), des modèles d'URL spécifiques et, bien sûr, des modèles et des fichiers statiques (images, CSS, JavaScript). Cela signifie que n'importe quelle application Django peut être réutilisée car elle est capable de fonctionner par elle-même.

En raccourci, un projet fait référence à un ensemble de configurations et d'applications destinées à créer une application Web. D'autre part, une application Django fait partie d'un projet, qui est autonome (a tout ce dont elle a besoin pour fonctionner), et son but est d'effectuer une opération spécifique.

Configurer un projet Django

Dans cette section, vous allez mettre en place un projet Django. Pour cela, vous allez utiliser différents outils comme un environnement virtuel pour organiser les dépendances Python et les scripts Django les plus importants. Django-admin et manage.py

Environnement virtuel

Je recommande toujours de travailler avec des environnements virtuels lors de la création d'applications avec Django. C'est le moyen le plus efficace de maintenir un ensemble spécifique de dépendances. Mais son objectif principal est d'isoler les packages de développement des packages globaux.

Créons donc un environnement virtuel avec python la commande de formulaire intégrée.

Remarque : Cette méthode nécessite Python 3.6 ou une version plus récente pour fonctionner.

 python -m venv .venv

Cette commande utilise la commande python -m ou python –mod . Fondamentalement, il exécute un module ou une bibliothèque, en tant que script. Selon la signification de cette commande, venv est la bibliothèque que nous exécutons et .venv fait référence au nom de l'environnement virtuel que nous voulons créer.

Donc, en langage clair, cette commande signifie.

Hé Python, exécutez en tant que script la bibliothèque intégrée venv et créez un nom virtualenv .venv

Maintenant, il est temps d'activer l'environnement virtuel que nous venons de créer, avec la commande suivante.

 source .venv/bin/activate

Pour affirmer que vous n'avez aucun paquet installé dans le nouveau venv, vous exécutez.

 pip freeze

Si vous avez correctement activé l'environnement virtuel, vous n'obtiendrez aucune sortie. C'est parce que nous n'avons encore rien installé.

Entrons dans Django

Afin de créer notre application de raccourcissement d'URL, nous allons commencer par installer le package Django. Django est un package tiers, nous devons donc l'installer avec Pip (Pip Installs Packages).

 $ pip install django Collecting django Downloading Django-3.2.1-py3-none-any.whl (7.9 MB) |████████████████████████████████| 7.9 MB 344 kB/s Collecting asgiref<4,>=3.3.2 Using cached asgiref-3.3.4-py3-none-any.whl (22 kB) Collecting sqlparse>=0.2.2 Using cached sqlparse-0.4.1-py3-none-any.whl (42 kB) Collecting pytz Using cached pytz-2021.1-py2.py3-none-any.whl (510 kB) Installing collected packages: asgiref, sqlparse, pytz, django Successfully installed asgiref-3.3.4 django-3.2.1 pytz-2021.1 sqlparse-0.4.1

Remarque : N'oubliez pas que $ n'est rien d'autre que votre symbole shell.

Pour vérifier si l'installation s'est correctement déroulée, nous vérifions à nouveau les packages installés de notre venv.

 $ pip freeze asgiref==3.3.4 Django==3.2.1 pytz==2021.1 sqlparse==0.4.1

Ne vous inquiétez pas si les versions que vous obtenez sont différentes de la mienne. Si Django reste sur la version 3.x, vous pouvez continuer sans problème.

Démarrer un projet Django

Une fois que vous avez installé Django, il est temps de créer la structure du site Web du raccourcisseur d'URL. Vous souvenez-vous de ce qu'est un projet Django ? Créons-en un en exécutant la commande suivante.

 django-admin startproject config

Expliquant tout sur cette commande, django-admin est un utilitaire de ligne de commande qui effectue toutes les tâches nécessaires pour créer un projet Django. La partie "startproject" est la commande exécutée par l'utilitaire Django-admin, et config est le nom du projet que nous allons créer.

Il est important de souligner que config peut être n'importe quel nom que vous voulez. La raison pour laquelle j'utilise config comme nom de ce projet est simplement par commodité. Il est agréable de basculer entre les projets et d'avoir toujours la même convention de nommage. N'ayez donc pas peur d'utiliser d'autres noms de projet quand vous le souhaitez.

Comme vous pouvez le remarquer, vous avez maintenant un dossier config/ et à l'intérieur, il y a de nombreux fichiers. Plus tard, nous verrons la structure des fichiers du projet. Pour l'instant, entrons dans le répertoire du projet et exécutons le serveur local.

 cd config/

Le fichier le plus important que vous utiliserez est le script manage.py . Il a les mêmes fonctionnalités que django-admin , mais le principal avantage de son utilisation est qu'il vous permet de gérer les paramètres lors de l'exécution du projet.

Voyons maintenant si tout fonctionne correctement.

 python manage.py runserver

Création de l'application de raccourcissement d'URL

Il est temps de créer l'application principale du projet. Vous allez utiliser le fichier manage.py pour accomplir cette tâche.

 python manage.py startapp urlshortener

Cela crée une application Django, avec le nom urlshortener . Si vous exécutez la commande tree, vous obtiendrez quelque chose comme ceci.

 . ├── config │ ├── asgi.py │ ├── __init__.py │ ├── settings.py │ ├── urls.py │ └── wsgi.py ├── manage.py └── urlshortener ├── admin.py ├── apps.py ├── __init__.py ├── migrations │ └── __init__.py ├── models.py ├── tests.py └── views.py

Précisons les différents fichiers créés jusqu'à ce moment. « config » est le nom de notre projet et il est nommé comme ça juste pour la convention. À l'intérieur de config, vous obtenez settings.py , c'est le fichier où vous définissez tous les paramètres de votre projet. urls.py est la configuration globale des URL à l'intérieur du projet. Il définit les chemins d'URL de toutes les applications à l'intérieur du projet.

Ne vous inquiétez pas trop des fichiers asgi.py et wsgi.py Ce sont des fichiers qui vous permettent de configurer votre application en déploiement.

Le manage.py est le script python qui vous permet d'exécuter toutes les commandes disponibles de Django-admin.

En regardant à l'intérieur de urlshortener qui est le nom de l'application que vous venez de créer, vous remarquerez peut-être qu'il y a un dossier étrange appelé "migrations/" et quelques autres fichiers qui sont cruciaux pour la logique de toute application.

apps.py est l'endroit où réside la configuration de l'application. Habituellement, vous ne vous amusez pas avec, sauf que vous faites des choses assez avancées.

admin.py est l'endroit où vous enregistrez vos modèles pour les rendre visibles dans le panneau d'administration de Django.

models.py est le plus important. A l'intérieur de ce module, vous devez définir les modèles, qui (disons vaguement) sont la façon dont les données sont stockées. Vous en saurez plus sur les modèles plus tard.

migrations/ est le dossier où sont stockées les migrations Django. Nous examinerons en profondeur plus tard.

tests.py est le fichier où sont stockés les tests. Nous ne couvrirons pas les tests dans ce tutoriel.

views.py est le fichier qui stocke les vues. Fondamentalement, il définit comment l'utilisateur interagira avec tous les aspects de votre application.

Installer une application Django

Avant de continuer, ouvrez le fichier settings.py et modifiez la variable INSTALLED_APPS en ajoutant l'application urlshortener.

 # Application definition INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', # Custom apps 'urlshortener', ]

Il s'agit d'un processus de routine lorsque vous créez une application. Donc à chaque fois que vous le faites, n'oubliez pas de l'installer dans les paramètres du projet.

Comprendre le modèle MVT

Le modèle Modèle, Vue, Modèle est le modèle de conception de logiciel que les développeurs Django utilisent pour créer des applications Web.

Il repose sur 3 concepts principaux. Modèle (données), Vue (Interaction de l'utilisateur avec les données), Modèle (Comment les utilisateurs voient les données).

Les modèles sont des classes Python, qui définissent tous les champs et le comportement des données que vous souhaitez stocker. Normalement, chaque modèle fait référence à une table unique sur la base de données

Les vues, dans leur expression la plus simple, sont des callables qui prennent une demande de l'utilisateur et génèrent une réponse. Entre ce processus se produit la logique métier. Je sais que la « logique métier » est un concept assez obscur, alors laissez-moi vous expliquer exactement de quoi il s'agit. La logique métier est la façon dont les données sont créées, stockées et supprimées, c'est tout.

Enfin, les modèles sont des documents texte (généralement Html) qui sont présentés aux utilisateurs. Son but est de présenter des données aussi propres que possible. Django intègre un mini-langage appelé Django template language (DTL) qui vous permet d'incorporer une partie de la puissance de python dans les documents texte.

Créer le modèle Shortener

Une fois que vous avez rapidement compris le modèle MVT, commençons à créer le raccourcisseur d'URL Django à partir de zéro.

Tout d'abord, définissons le modèle de raccourcissement à l'intérieur du fichier models.py .

 ''' Url shortener model ''' from django.db import models # Create your models here. class Shortener(models.Model): ''' Creates a short url based on the long one created -> Hour and date a shortener was created times_followed -> Times the shortened link has been followed long_url -> The original link short_url -> shortened link https://domain/(short_url) ''' created = models.DateTimeField(auto_now_add=True) times_followed = models.PositiveIntegerField(default=0) long_url = models.URLField() short_url = models.CharField(max_length=15, unique=True, blank=True) class Meta: ordering = ["-created"] def __str__(self): return f'{self.long_url} to {self.short_url}'

Je sais. C'est une classe assez énorme, avec beaucoup de choses étranges, mais ne désespérez pas. J'irai étape par étape sur chaque chose importante.

Explication du modèle

Tout d'abord, nous importons le module models . Ce module contient toutes les fonctionnalités dont nous avons besoin pour créer un modèle Django.

En examinant le modèle "Shortener", la première chose à noter est qu'il étend les models.Model . En fait, tout modèle dans n'importe quelle application Django doit être une sous-classe de la classe models.Model.

Ensuite, nous définissons tous les champs que le modèle aura sur la base de données. Le champ « créé » est la date et l'heure de création du lien raccourci, nous utilisons donc DateTimeField pour créer ce type de fonctionnalité. Nous utilisons l'argument auto_now_add=True car nous voulons que le champ ne soit modifié que lorsque l'instance est créée.

Le deuxième champ times_followed fait référence aux heures d'utilisation de l'URL raccourcie. C'est un PositiveIntegerField et nous spécifions une valeur par défaut de zéro. Cela signifie que chaque fois qu'une instance a créé le champ times_followed , Django remplira ce champ avec 0.

D'autre part, long_url fait référence à l'URL long_url par l'utilisateur. Il s'agit d'un URLField , car nous souhaitons que l'utilisateur ne saisisse que les caractères du formulaire : http://yoursite.com .

Le dernier champ est short_url , et il contient des détails intéressants. Nous spécifions qu'il ne peut contenir que 15 caractères, il doit être unique, ce qui signifie qu'il ne peut pas y avoir d'éléments répétés dans ce champ. Enfin, nous indiquons qu'il peut être laissé vide, ce qui signifie que lorsqu'ils travaillent avec des formulaires, les utilisateurs n'auront pas besoin d'écrire leur propre code abrégé.

La classe interne Meta, nous dit comment la classe doit se comporter, et nous définissons que l'ordre (en appelant Shortener.objects.all() ) des objets raccourcisseurs sera discriminé par les plus récents.

La méthode __str__ indique comment le modèle doit être imprimé. Donc, si nous avons un objet avec long_url = "https://geekflare.com/" et une partie raccourcie "123456", et nous l'imprimons.

 https://geekflare.com/ to 123456

Il est maintenant temps de rechercher un moyen d'enregistrer le lien court de manière aléatoire.

Création d'une fonctionnalité de raccourcissement

Nous allons créer 2 fonctions personnalisées. Le premier générera un code aléatoire et le second empêchera d'obtenir des codes aléatoires répétés du modèle Shortener. Pour ce faire, créez un fichier utils.py dans l'application "urlshortener".

 touch utils.py

À l'intérieur de ce fichier, nous allons utiliser la fonction de choix du module aléatoire intégré. Cela facilite la tâche de choisir des caractères aléatoires pour créer le code.

 ''' Utilities for Shortener ''' from django.conf import settings from random import choice from string import ascii_letters, digits # Try to get the value from the settings module SIZE = getattr(settings, "MAXIMUM_URL_CHARS", 7) AVAIABLE_CHARS = ascii_letters + digits def create_random_code(chars=AVAIABLE_CHARS): """ Creates a random string with the predetermined size """ return "".join( [choice(chars) for _ in range(SIZE)] )

Comme vous pouvez le voir, cette fonction renvoie une chaîne aléatoire de la longueur spécifiée dans le fichier de paramètres ou 7 par défaut. Vous utilisez la fonction getattr pour obtenir une variable du module de paramètres, mais sans générer d'erreur si la variable n'est pas spécifiée.

Faisons quelques calculs. Si nous avons 7 lieux où il peut y avoir jusqu'à 62 caractères disponibles pour chaque lieu, les permutations possibles sont :

Ainsi, sur la base de ces calculs rapides, la partie raccourcie peut être remplie jusqu'à 2,5 billions de codes différents. Ainsi, nous pouvons oublier de sortir des URL raccourcies aléatoires.

Bien qu'il puisse exister autant de permutations, il y a une faible probabilité d'obtenir des parties raccourcies répétées. C'est un problème car nous avons configuré le champ shortened_url pour qu'il soit unique. C'est pourquoi la fonction suivante est si utile.

 def create_shortened_url(model_instance): random_code = create_random_code() # Gets the model class model_class = model_instance.__class__ if model_class.objects.filter(short_url=random_code).exists(): # Run the function again return create_shortened_url(model_instance) return random_code

Voyons ce qui se passe ici. La fonction prend en argument une instance de modèle « Shortener ». Tout d'abord, la fonction génère un code aléatoire à l'aide de create_random_code . Ensuite, il obtient la classe du modèle et vérifie s'il existe un autre objet qui a le même short_url . Si c'est le cas, il s'exécute une fois de plus, mais si tout va bien, il renvoie le random_code.

Plus tard, vous interagirez avec le shell, afin d'examiner cette fonction de près.

Après avoir créé la fonction utilitaire, utilisons-la pour créer des codes aléatoires dans le modèle du raccourcisseur.

Modification de la méthode de sauvegarde

A la fin de la classe "Shortener", vous allez modifier la méthode de sauvegarde du modèle. La méthode save est appelée à chaque fois qu'un objet est enregistré dans la base de données, nous verrons donc comment l'utiliser ici.

 # Import the function used to create random codes from .utils import create_shortened_url # At the end of the Shortener model def save(self, *args, **kwargs): # If the short url wasn't specified if not self.short_url: # We pass the model instance that is being saved self.short_url = create_shortened_url(self) super().save(*args, **kwargs)

La méthode de sauvegarde est écrasée, ce qui signifie que vous introduisez de nouvelles fonctionnalités dans une méthode parent préexistante. Il s'agit essentiellement de dire à Django que chaque fois qu'un objet "Shortener" est enregistré et que le short_url n'est pas spécifié, il doit être rempli avec un code aléatoire.

Exécution de migrations

Il est maintenant temps d'effectuer et d'exécuter les migrations du modèle Shortener. Pour ce faire, exécutez les commandes suivantes dans le dossier racine du projet.

 $ python manage.py makemigrations Migrations for 'urlshortener': urlshortener/migrations/0001_initial.py - Create model Shortener $ python manage.py migrate Operations to perform: Apply all migrations: admin, auth, contenttypes, sessions, urlshortener Running migrations: ...... # Apply the URL shortener migrations Applying urlshortener.0001_initial... OK

Pour l'instant, vous n'avez pas à vous soucier de ce que sont les migrations. Gardez simplement à l'esprit que lors de l'exécution de ces deux commandes, Django crée un fichier de base de données db.sqlite, basé sur les modèles que vous avez définis.

Créons des objets avec le shell Django.

 $ python manage.py shell >>> from urlshortener.models import Shortener >>> s = Shortener(long_url="https://geekflare.com") >>> s.short_url '' >>> s.save() >>> s.short_url 'kdWFVIc' >>> s.long_url 'https://geekflare.com' >>> print(s) https://geekflare.com to kdWFVIc

C'est à peu près comme cela que fonctionneront tous les objets plus courts.

Écriture de vues

Comme je l'ai dit précédemment, une vue est une fonction simple qui prend une requête et renvoie une réponse. Voyons donc comment créer une vision du monde de bonjour.

Modèle de réponse de base

À l'intérieur du fichier "urlshortener/views.py", créez une fonction home_view . aa

 ''' Shortener views ''' from django.shortcuts import render, get_object_or_404 # We will use it later from django.http import HttpResponse # Create your views here. def home_view(request): return HttpResponse("Hello world")

Il renvoie un message simple « Hello world ». Plus tard, vous verrez à quoi cela ressemble dans le navigateur. Créez maintenant un "urls.py", il y aura tous les modèles d'URL de l'application.

touch urls.py


Ajoutez le code suivant.

 ''' Urls for shortener app urlshortener/urls.py ''' from django.urls import path # Import the home view from .views import home_view appname = "shortener" urlpatterns = [ # Home view path("", home_view, name="home") ]

La variable appname déclare (comme son nom l'indique) l'espacement de noms de l'application urlshortener.

Expliquant rapidement, nous importons la fonction path, qui renvoie un élément à inclure dans les urlpatterns de l'application. L'attribut name est l'espace de noms du chemin, qui peut être appelé à l'intérieur des modèles si nécessaire.

Modifions maintenant les URL globales du projet.

 # config/urls.py from django.contrib import admin from django.urls import path, include urlpatterns = [ path('admin/', admin.site.urls), # Shortener Urls path('', include('urlshortener.urls')) ]

Maintenant, exécutons à nouveau le serveur.

 python manage.py runserver

Si vous exécutez le serveur, vous obtiendrez un simple message « Hello world ». C'est parce que vous incluez les urlpatterns de l'application de raccourcissement d'URL dans le projet global.

Ce n'est qu'un point de départ. Il est maintenant temps de créer un formulaire pour permettre à l'utilisateur de créer lui-même des URL raccourcies.

Création de formulaires

Dans Django, un formulaire est une classe simple qui permet d'obtenir une entrée de l'utilisateur.

Vous allez créer un fichier forms.py. C'est une convention de stocker toutes les formes de l'application dans ce fichier.

 cd urlshortener/ touch forms.py

À l'intérieur de ce fichier, vous allez créer une classe "ShortenerForm" qui s'étend de "ModelForm".

 ''' Shortener Forms urlshortener/forms.py ''' from django import forms from .models import Shortener class ShortenerForm(forms.ModelForm): long_url = forms.URLField(widget=forms.URLInput( attrs={"class": "form-control form-control-lg", "placeholder": "Your URL to shorten"})) class Meta: model = Shortener fields = ('long_url',)

Il s'agit d'un formulaire modèle puisque son but est de créer un objet modèle à partir de la saisie de l'utilisateur. Nous utilisons également l'argument widget, qui nous permet de spécifier l'attribut "class" (classe en CSS, pas en python). C'est parce que nous allons styliser l'application avec bootstrap plus tard.

Finir les vues

Après avoir créé les formulaires, il est temps de créer la logique métier finale de l'application.

Accédez au fichier views.py dans l'application de raccourcissement et modifiez la vue home_view . Vous pouvez consulter le référentiel Github en ce moment pour avoir une idée de la structure du projet.

Il existe deux vues pour l'application de raccourcissement d'URL :

1. Vue d'accueil : affiche le formulaire de raccourcissement et la nouvelle URL si le formulaire a déjà été soumis.
2. Vue de redirection : cela redirige vers l'URL longue et ajoute 1 aux heures suivies.

Commençons par la vue d'accueil qui est la plus complexe. Vous devrez importer le modèle et le formulaire Shortener. Vous utilisez toujours une fonction car je veux que vous compreniez tout le flux de données de la vue. De plus, vous utiliserez le chemin d'un modèle (qui n'est pas encore créé).

Vue d'accueil

 ''' Shortener views ''' from django.shortcuts import render # We will use it later from django.http import HttpResponse, Http404, HttpResponseRedirect # Model from .models import Shortener # Custom form from .forms import ShortenerForm # Create your views here. def home_view(request): template = 'urlshortener/home.html' context = {} # Empty form context['form'] = ShortenerForm() if request.method == 'GET': return render(request, template, context) elif request.method == 'POST': used_form = ShortenerForm(request.POST) if used_form.is_valid(): shortened_object = used_form.save() new_url = request.build_absolute_uri('/') + shortened_object.short_url long_url = shortened_object.long_url context['new_url'] = new_url context['long_url'] = long_url return render(request, template, context) context['errors'] = used_form.errors return render(request, template, context)

La vue est basée sur deux conditions :

1. Lorsque la méthode HTTP vaut GET : Nous ne transmettons comme contexte que la forme Shortener utilisée pour créer des objets Shortener.
2. Lorsque la méthode HTTP est égale à POST : nous passons toujours le formulaire dans le contexte car nous voulons que l'utilisateur puisse saisir une autre URL. Mais nous transmettons la requête Post à un autre formulaire appelé used_form.

Un moyen délicat d'obtenir l'URL complète du site de manière dynamique consiste à utiliser la méthode d'objet de requête build_absolute_uri .

 >>> print(request.build_absolute_uri('/')) 'https://localhost:8080/'

Comme moyen sûr de traiter une mauvaise demande (l'utilisateur n'a pas entré d'URL valide), nous obtenons les erreurs de formulaire, les transmettons en tant que contexte et rendons le modèle normal. Plus tard, vous verrez comment implémenter l'affichage des erreurs dans le modèle.

Vue de redirection

Le redirect_url_view , est un peu plus simple. C'est une vue détaillée ce qui signifie que la vue ne fonctionne qu'avec un objet.

Cette fonction prend en paramètre la requête de l'utilisateur et la partie raccourcie de l'URL. Il n'est pas nécessaire d'affirmer le type de demande que nous recevons, car nous ne travaillons pas avec des formulaires dans cette vue.

 def redirect_url_view(request, shortened_part): try: shortener = Shortener.objects.get(short_url=shortened_part) shortener.times_followed += 1 shortener.save() return HttpResponseRedirect(shortener.long_url) except: raise Http404('Sorry this link is broken :(')

Nous protégeons la vue avec une instruction try/except , au cas où la partie raccourcie ne serait pas trouvée dans la base de données. Si l'objet est trouvé, il ajoute 1 au champ times_followed et redirige avec la fonction HttpResponseRedirect vers l'URL du site correspondant au code aléatoire.

Mise à jour des URL

Une fois que vous avez créé les deux vues de l'application, il est temps de créer les modèles d'URL finaux en incluant le chemin d'accès à redirect_url_view .

Comme toujours, vous commencez par importer les vues, puis créez une fonction de chemin et passez en arguments :

• La route des URL
• La vue pointant sur le chemin
• Le nom du chemin

 ''' Urls for shortener app urlshortener/urls.py ''' from django.urls import path # Import the home view from .views import home_view, redirect_url_view appname = "shortener" urlpatterns = [ # Home view path('', home_view, name='home'), path('<str:shortened_part>', redirect_url_view, name='redirect'), ]

Avec cette configuration d'URL, le routage de l'application ressemble à ceci.

• localhost:8000/ : vue d'accueil
• localhost:8000/URL-code : Redirection vers l'URL longue

Création de modèles

Tu es presque là. La seule chose qui vous sépare de la création de cette application est l'interface utilisateur. Pour cela, nous utilisons des modèles Django.

Les modèles sont utilisés pour rendre une interface claire à l'utilisateur de l'application. Ces fichiers sont créés à l'intérieur de l'application dans une double structure de dossiers de la forme : « templates/appname »

 # urlshortener directory mkdir -p templates/urlshortener/

Remarque : La double structure de dossiers et le langage Django Template sortent du cadre de ce tutoriel mais vous pouvez les lire dans la documentation officielle.

Modèle de base

Django autorise l'héritage de modèles. Cela signifie que nous pouvons avoir un modèle de base et l'étendre dans le but de suivre le principe DRY (Ne vous répétez pas).

 cd templates/urlshortener touch base.html

Le fichier base.html est une convention et signifie que tous les autres modèles de l'application doivent être une extension de celui-ci.

 <!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>Django Url shortener</title> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-wEmeIV1mKuiNpC+IOBjI7aAzPcEZeedi5yW5f2yOq55WWLwNGmvvx4Um1vskeMj0" crossorigin="anonymous" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" /> </head> <body> {% block body %} {% endblock body %} <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-p34f1UUtsS3wqzfto5wAAmdvj+osOnFyQFpp4Ua3gs/ZVWx6oOypYoCJhGGScy+8" crossorigin="anonymous" ></script> </body> </html>

Nous allons utiliser le CDN d'amorçage, pour faire une interface rapide et jolie sans avoir besoin de fichiers CSS ou javascript.

Si vous souhaitez en savoir plus sur les balises DTL, vous pouvez le faire avec les documents officiels.

Modèle d'accueil

Le modèle home, hérité du fichier base.html. Cela signifie que ce modèle inclut tout le code HTML du fichier parent.

 {% extends 'urlshortener/base.html' %} {% block body %} <div class="container"> <div class="card mt-5"> <div class="card-header text-center py-3"> <h1>URL Shortner Application <i class="fas fa-link px-2"></i></h1> </div> <div class="px-3 py-4"> <form action="" method="POST"> {% csrf_token %} <div class="row g-1"> <div class="col-10">{{form.long_url}}</div> <div class="col-2"> <button class="btn btn-success btn-lg w-100" type="submit"> Shorten </button> </div> </div> </form> </div> </div> {% if errors %} <div class="alert alert-danger mt-4" role="alert"> <p>{{errors}}</p> </div> {% endif %} {% if new_url %} <div class="mx-auto text-center mt-5"> <h2 class="text-danger">Your shortened Url</h2> <p>You can copy the Link below and share it with your friends</p> <p class="">{{new_url}}</p> <p><span class="text-danger">Previous URL:</span> {{long_url}}</p> </div> {% endif %} </div> {% endblock body %}

Je vais expliquer rapidement le flux de données de ce modèle :

• Le formulaire Raccourcisseur s'affiche. À l'intérieur, le jeton crsf est défini (raisons de sécurité) et seul le champ URL long du formulaire est affiché. N'oubliez pas que ce champ a la classe CSS, « form-control form-control-lg », car nous la définissons dans le formulaire.
• Si des erreurs sont trouvées, affichez-les
• Si l'opération POST réussit, la nouvelle URL s'affiche.

Demande finale

Toutes nos félicitations! . Vous avez créé une application de raccourcissement d'URL fonctionnelle complète avec Django.

Voici quelques captures d'écran de l'apparence de l'application.

Obtenez uniquement :

Erreur lors du raccourcissement de l'URL :

URL raccourcie réussie :

URL redirigée :

Que pensez-vous d'exposer une démo de cette application de raccourcissement d'URL à quelqu'un ? Vérifiez comment exposer une application Django Demo sur Internet.

Défi

Si vous vous sentez à l'aise avec vos compétences Django, pourquoi ne pas pratiquer avec un défi ?.

Clonez le code de cette application et créez un système d'authentification, où seuls les utilisateurs enregistrés peuvent raccourcir leurs URL.

Lorsque vous avez terminé, envoyez une pull request et envoyez-moi un ping sur Twitter pour présenter vos réalisations.

Emballer

Vous avez atteint la fin de ce tutoriel. Croyez-le ou non, vous venez de passer en revue tous les principaux aspects de la création d'un projet Django. J'espère que vous l'avez trouvé extrêmement utile.

Dans ce tutoriel, vous :

• Connaître le workflow de création d'une application Django.
• Construire un projet de CV
• Compréhension des différences et de la structure des projets Django et des applications Django.
• Découverte du modèle MVT.
• Vues de base de fonction créées
• Utilisation de Django ORM (Object Relational Mapper) pour créer des modèles simples

C'est tout, il y a beaucoup à couvrir avec le framework Web Django, alors restez en contact pour d'autres tutoriels étonnants.