Eine Anleitung zum Erstellen einer URL-Shortener-App mit Django

Veröffentlicht: 2021-05-09

Der beste Weg, Django oder eine beliebige Fertigkeit zu erlernen, besteht darin, Ihr Wissen anzuwenden, indem Sie funktionale Projekte erstellen.

Django ist das am häufigsten verwendete Python-Webentwicklungs-Framework. Seine integrierten Funktionen und die umfangreiche Menge an Drittanbieter-Paketen haben es zu einem der beliebtesten Web-Frameworks auf der ganzen Welt gemacht.

Es ist schnell, zuverlässig und verfügt über viele integrierte Funktionen. Zum Beispiel ein vollständiges Authentifizierungssystem, mit dem Sie sich auf die Hauptfunktionen Ihrer App konzentrieren können. Außerdem können Sie externe Pakete installieren, um noch komplexere Aufgaben zu erledigen, wie z. B. Django-allauth , mit dem Sie Benutzer mit ihren sozialen Konten registrieren können.

Aber lassen Sie uns einige Fakten aufdecken. Django ist ein so großes Framework, dass es manchmal schwierig ist, damit anzufangen.

Heute werden Sie also eine völlig funktionsfähige Django-Anwendung von Grund auf neu erstellen.

Am Ende dieses Tutorials werden Sie:

  • Habe eine URL-Shortener-App geschrieben
  • Verstehen Sie das Django MVT-Muster
  • Den Workflow zum Erstellen eines Projekts kennengelernt haben

Voraussetzungen

Alle folgenden Anforderungen sind optional und helfen Ihnen, dem Tutorial zu folgen. Aber keine Sorge, wenn Sie noch keine Erfahrung damit haben. Der wichtigste Schritt ist der erste.

  • Grundverständnis von UNIX-Befehlen (ls, cd, rm, touch)
  • Grundverständnis von Python-Klassen und -Funktionen
  • Python auf Ihrem Computer installiert (Vielleicht offensichtlich, aber ich musste es einschließen)
  • Es wäre toll, wenn du schon etwas mit Django gebaut hast

Der gesamte funktionierende Code wird in diesem Github-Repository verfügbar sein.

Nun, da Sie die vorherigen Konzepte kristallklar haben, kommen wir zur Sache.

Projektaussage

In diesem Tutorial erstellen Sie einen URL-Shortener. Grundsätzlich ist ein URL-Shortener ein Dienst, der eine lange URL aufnimmt und in eine kompakte umwandelt.

Wenn Sie beispielsweise einen Tweet teilen und einen Link zu Ihrer Website einfügen möchten, aber die Zeichenbegrenzung haben, können Sie einen URL-Kürzer verwenden.

Sehen wir es uns mit einer Grafik an.

URL-Verkürzer

Wie Sie sehen, erhält der URL-Shortener eine lange URL und gibt eine kurze zurück. Genau das werden Sie heute bauen.

In diesem Projekt üben Sie die Verwendung des MVT-Musters, lernen die Grundlagen des Datenbankdesigns mit Django-Modellen und lernen, wie Sie dem Benutzer Informationen über Ansichten, URLs und Vorlagen anzeigen.

Aufbau eines Django-Projekts

Grundsätzlich baut eine Django-Website auf einem einzigen Projekt und mehreren getrennten Apps auf . Jede dieser Apps verfügt über spezifische Funktionen und kann eigenständig arbeiten.

Stellen wir uns eine komplexe Webanwendung wie Stackoverflow vor. Seine Funktionalität basiert auf zwei Hauptaspekten.

  • Benutzerverwaltung: Anmelden, Abmelden, Reputation, Berechtigungen
  • Forum: Fragen, Antworten, Tags, Filter

Nach der Struktur der Django-Website würde das Projekt also StackOverflow heißen, das zwei Hauptanwendungen hat. Die Benutzer- App und die Forums- App.

Jede dieser Apps verfügt über eigenständige Funktionen. Das bedeutet, dass beide den gesamten Code enthalten, den sie für eine ordnungsgemäße Funktion benötigen.

Dazu gehören Modelle (Datenbankstruktur), Ansichten (Anfragen und Antworten), spezifische URL-Muster und natürlich Vorlagen und statische Dateien (Bilder, CSS, JavaScript). Dies bedeutet, dass jede Django-App wiederverwendet werden kann, da sie selbstständig arbeiten kann.

Kurz gesagt, ein Projekt bezieht sich auf eine Reihe von Konfigurationen und Apps, die zum Erstellen einer Webanwendung bestimmt sind. Auf der anderen Seite ist eine Django-App Teil eines in sich abgeschlossenen Projekts (mit allem, was es zum Funktionieren benötigt) und dient der Durchführung einer bestimmten Operation.

Ein Django-Projekt einrichten

In diesem Abschnitt richten Sie ein Django-Projekt ein. Zu diesem Zweck werden Sie verschiedene Tools wie eine virtuelle Umgebung verwenden, um Python-Abhängigkeiten und die wichtigsten Django-Skripte zu organisieren. Django-admin und manage.py

Virtuelle Umgebung

Ich empfehle immer, beim Erstellen von Apps mit Django mit virtuellen Umgebungen zu arbeiten. Dies ist die effizienteste Methode, um einen bestimmten Satz von Abhängigkeiten aufrechtzuerhalten. Sein Hauptzweck besteht jedoch darin, die Entwicklungspakete von den globalen zu isolieren.

Erstellen wir also eine virtuelle Umgebung mit Python, dem integrierten Formularbefehl.

Hinweis: Diese Methode erfordert Python 3.6 oder neuere Versionen, um zu funktionieren.

 python -m venv .venv

Dieser Befehl verwendet den Befehl python -m oder python –mod . Im Grunde führt es ein Modul oder eine Bibliothek als Skript aus. Gemäß der Bedeutung dieses Befehls ist venv die Bibliothek, die wir ausführen , und .venv bezieht sich auf den Namen der virtuellen Umgebung, die wir erstellen möchten.

Im Klartext bedeutet dieser Befehl also.

Hey Python, führe als Skript die eingebaute Bibliothek venv aus und erstelle einen virtuellenenv-Namen .venv

Jetzt ist es an der Zeit, die gerade erstellte virtuelle Umgebung mit dem folgenden Befehl zu aktivieren.

 source .venv/bin/activate

Um zu bestätigen, dass im neuen venv keine Pakete installiert sind, führen Sie aus.

 pip freeze

Wenn Sie die virtuelle Umgebung richtig aktiviert haben, erhalten Sie keine Ausgabe. Das liegt daran, dass wir noch nichts installiert haben.

Kommen wir zu Django

Um unsere URL-Shortener-Anwendung zu erstellen, installieren wir zunächst das Django-Paket. Django ist ein Drittanbieterpaket, daher müssen wir es mit Pip (Pip Installs Packages) installieren.

 $ 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

Hinweis: Denken Sie daran, dass $ nichts anderes als Ihr Shell-Symbol ist.

Um zu überprüfen, ob die Installation korrekt gelaufen ist, überprüfen wir noch einmal die installierten Pakete unserer venv.

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

Machen Sie sich keine Sorgen, wenn sich die Versionen, die Sie erhalten, von meinen unterscheiden. Wenn Django noch auf Version 3.x läuft, können Sie problemlos fortfahren.

Ein Django-Projekt starten

Nachdem Sie Django installiert haben, ist es an der Zeit, die Struktur der URL-Shortener-Website zu erstellen. Weißt du noch, was ein Django-Projekt ist? Lassen Sie uns einen erstellen, indem Sie den folgenden Befehl ausführen.

 django-admin startproject config

Um diesen Befehl zu erklären, ist django-admin ein Befehlszeilendienstprogramm, das alle erforderlichen Aufgaben ausführt, um ein Django-Projekt zu erstellen. Der „startproject“-Teil ist der Befehl, der vom Dienstprogramm Django-admin ausgeführt wird, und config ist der Name des Projekts, das wir erstellen werden.

Es ist wichtig zu betonen, dass config ein beliebiger Name sein kann. Der Grund, warum ich config als Namen für dieses Projekt verwende, ist nur der Einfachheit halber. Es ist schön, zwischen Projekten zu wechseln und trotzdem die gleiche Namenskonvention zu haben. Scheuen Sie sich also nicht davor, andere Projektnamen zu verwenden, wann immer Sie möchten.

Wie Sie vielleicht bemerken, haben Sie jetzt einen Ordner config/ und darin befinden sich viele Dateien. Später sehen wir die Dateistruktur des Projekts. Lassen Sie uns zunächst das Projektverzeichnis eingeben und den lokalen Server ausführen.

 cd config/

Die wichtigste Datei, die Sie verwenden werden, ist das Skript manage.py . Es hat die gleiche Funktionalität wie django-admin , aber der Hauptvorteil der Verwendung besteht darin, dass Sie die Einstellungen beim Ausführen des Projekts verwalten können.

Jetzt schauen wir mal ob alles richtig funktioniert.

 python manage.py runserver

Django-Demo-App

Erstellen der URL-Shortener-App

Es ist Zeit, die Haupt-App des Projekts zu erstellen. Sie werden die Datei manage.py verwenden, um diese Aufgabe auszuführen .

 python manage.py startapp urlshortener

Dadurch wird eine Django-App mit dem Namen urlshortener erstellt . Wenn Sie den Befehl tree ausführen, erhalten Sie so etwas.

 . ├── 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

Lassen Sie uns die verschiedenen Dateien klären, die bis zu diesem Zeitpunkt erstellt wurden. „config“ ist der Name unseres Projekts und es wird nur für die Konvention so genannt. Innerhalb von config erhalten Sie settings.py , die Datei, in der Sie alle Einstellungen Ihres Projekts festlegen. urls.py ist die Gesamtkonfiguration der URLs innerhalb des Projekts. Es definiert die URL-Pfade aller Anwendungen innerhalb des Projekts.

Machen Sie sich keine Sorgen um die Dateien asgi.py und wsgi.py Dies sind Dateien, mit denen Sie Ihre Anwendung in der Bereitstellung konfigurieren können.

Die manage.py ist das Python-Skript, mit dem Sie alle verfügbaren Befehle von Django-admin ausführen können.

Wenn Sie einen Blick in den urlshortener , den Namen der gerade erstellten App, werden Sie möglicherweise feststellen, dass es einen seltsamen Ordner namens "migrations/" und einige andere Dateien gibt, die für die Logik jeder App von entscheidender Bedeutung sind.

apps.py ist der Ort, an dem sich die App-Konfiguration befindet. Normalerweise macht man damit nichts herum, außer man macht ziemlich fortgeschrittene Sachen.

admin.py ist der Ort, an dem Sie Ihre Modelle registrieren, um sie im Django-Admin-Panel sichtbar zu machen.

models.py ist die wichtigste. In diesem Modul müssen Sie die Modelle definieren , die (vage gesagt) die Art und Weise sind, in der die Daten gespeichert werden. Über Modelle erfährst du später mehr.

migrations/ ist der Ordner, in dem Django-Migrationen gespeichert werden. Wir werden später genauer darauf eingehen.

tests.py ist die Datei, in der die Tests gespeichert werden. Wir werden das Testen in diesem Tutorial nicht behandeln.

views.py ist die Datei, die Ansichten speichert. Im Wesentlichen definiert es, wie der Benutzer mit allen Aspekten Ihrer App interagiert.

Installieren einer Django-App

Bevor Sie fortfahren, öffnen Sie die Datei settings.py und ändern Sie die Variable INSTALLED_APPS , indem Sie die URL-Shortener-App hinzufügen.

 # 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', ]

Dies ist ein routinemäßiger Vorgang, wenn Sie eine App erstellen. Vergessen Sie also nicht, es jedes Mal in den Projekteinstellungen zu installieren.

Das MVT-Muster verstehen

Das Model-, View-, Template-Muster ist das Software-Entwurfsmuster, das Django-Entwickler verwenden, um Webanwendungen zu erstellen.

MVT-Muster

Es basiert auf 3 Hauptkonzepten. Modell (Daten), Ansicht (Benutzerinteraktion mit Daten), Vorlage (Wie die Benutzer die Daten sehen).

Modelle sind Python-Klassen, die alle Felder und das Verhalten der Daten definieren, die Sie speichern möchten. Normalerweise bezieht sich jedes Modell auf eine eindeutige Tabelle in der Datenbank

Ansichten in ihrem einfachsten Ausdruck sind Callables, die eine Anfrage des Benutzers annehmen und eine Antwort generieren. Dazwischen tritt die Geschäftslogik auf. Ich weiß, dass „Geschäftslogik“ ein ziemlich obskures Konzept ist, also lassen Sie mich genau erklären, was es ist. Geschäftslogik ist die Art und Weise, wie Daten erstellt, gespeichert und gelöscht werden, das ist alles.

Schließlich sind Vorlagen Textdokumente (normalerweise Html), die den Benutzern angezeigt werden. Sein Zweck ist es, Daten so sauber wie möglich darzustellen. Django enthält eine Mini-Sprache namens Django Template Language (DTL), mit der Sie einen Teil der Leistungsfähigkeit von Python in Textdokumente integrieren können.

Erstellen Sie das Shortener-Modell

Nachdem Sie das MVT-Muster schnell verstanden haben, können wir den Django-URL-Shortener von Grund auf neu erstellen.

Zunächst definieren wir das models.py Modell in der Datei 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}'

Ich weiss. Es ist eine ziemlich große Klasse, in der viele seltsame Dinge vor sich gehen, aber verzweifeln Sie nicht. Ich gehe Schritt für Schritt bei jedem wichtigen Punkt vor.

Modellerklärung

Als erstes importieren wir das models Modul. Dieses Modul enthält alle Funktionen, die wir zum Erstellen eines Django-Modells benötigen.

Betrachtet man das „Shortener“-Modell, so fällt zunächst auf, dass es die models.Model . Tatsächlich muss jedes Modell in jeder Django-App eine Unterklasse der models.Model-Klasse sein.

Dann definieren wir alle Felder, die das Modell in der Datenbank haben wird. Das Feld „erstellt“ ist das Datum und die Uhrzeit, zu der der verkürzte Link erstellt wurde. Daher verwenden wir DateTimeField , um diese Art von Funktionalität zu erstellen. Wir verwenden das Argument auto_now_add=True, weil wir möchten, dass das Feld nur beim Erstellen der Instanz geändert wird.

Das zweite Feld times_followed bezieht sich auf die Zeiten, in denen die verkürzte URL verwendet wurde. Es ist ein PositiveIntegerField und wir geben einen Standardwert von Null an. Das bedeutet, dass Django jedes Mal, wenn eine Instanz das Feld times_followed erstellt hat, dieses Feld mit 0 ausfüllt.

Auf der anderen Seite bezieht sich long_url auf die URL, die der Benutzer eingibt. Es ist ein URLField , da wir nur möchten, dass der Benutzer Zeichen der Form http://yoursite.com .

Das letzte Feld ist short_url und enthält interessante Details. Wir geben an, dass es nur 15 Zeichen lang sein darf, es muss eindeutig sein, was bedeutet, dass sich in diesem Feld keine Elemente wiederholen dürfen. Schließlich weisen wir darauf hin, dass es leer gelassen werden kann, was bedeutet, dass Benutzer bei der Arbeit mit Formularen keinen eigenen Kürzelcode schreiben müssen.

Die innere Klasse Meta sagt uns, wie sich die Klasse verhalten muss, und wir legen fest, dass die Reihenfolge (Aufruf von Shortener.objects.all() ) der Shortener-Objekte von den neuesten unterschieden wird.

Die Methode __str__ , wie das Modell gedruckt werden muss. Wenn wir also ein Objekt mit long_url = „https://geekflare.com/“ und dem verkürzten Teil „123456“ haben, drucken wir es aus.

 https://geekflare.com/ to 123456

Jetzt ist es an der Zeit, nach einer Möglichkeit zu suchen, den kurzen Link auf zufällige Weise zu speichern.

Verkürzungsfunktion erstellen

Wir werden 2 benutzerdefinierte Funktionen erstellen. Der erste generiert einen Zufallscode und der zweite verhindert, dass wiederholte Zufallscodes vom Shortener-Modell erhalten werden. Erstellen Sie dazu eine Datei utils.py in der App „urlshortener“.

 touch utils.py

In dieser Datei verwenden wir die Auswahlfunktion aus dem zufälligen eingebauten Modul. Dies erleichtert die Aufgabe, zufällige Zeichen auszuwählen, um den Code zu erstellen.

 ''' 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)] )

Wie Sie sehen, gibt diese Funktion eine zufällige Zeichenfolge der Länge zurück, die in der Einstellungsdatei angegeben ist, oder standardmäßig 7 zurück. Sie verwenden die Funktion getattr, um eine Variable aus dem Einstellungsmodul abzurufen, jedoch ohne einen Fehler auszulösen, wenn die Variable nicht angegeben ist.

Lass uns etwas rechnen. Wenn wir 7 Orte haben, an denen bis zu 62 Zeichen für jeden Ort verfügbar sein können, sind die möglichen Permutationen:

Basierend auf diesen schnellen Berechnungen kann der verkürzte Teil also bis zu 2,5 Billionen verschiedene Codes ausgefüllt werden. So können wir vergessen, aus zufällig gekürzten URLs herauszukommen.

Obwohl es so viele Permutationen geben kann, gibt es eine geringe Wahrscheinlichkeit, wiederholte verkürzte Teile zu erhalten. Dies ist ein Problem , da wir das einrichten shortened_url Feld eindeutig sein. Deshalb ist die folgende Funktion so nützlich.

 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

Mal sehen, was hier passiert. Die Funktion verwendet als Argument eine Modellinstanz des Typs „Shorter“. Zuerst generiert die Funktion einen Zufallscode unter Verwendung von create_random_code . Dann wird es die Modellklasse und überprüft , ob es eine andere Aufgabe ist es , die denselben hat short_url . Wenn dies der Fall ist, läuft es noch einmal von selbst, aber wenn alles in Ordnung ist, gibt es den random_code zurück.

Später werden Sie mit der Shell interagieren, um sich diese Funktion genauer anzusehen.

Nachdem wir die Utility-Funktion erstellt haben, verwenden wir sie, um Zufallscodes im Shortener-Modell zu erstellen.

Ändern der Speichermethode

Am Ende der Klasse „Shortener“ ändern Sie die Methode zum Speichern des Modells. Die Methode save wird jedes Mal aufgerufen, wenn ein Objekt in der Datenbank gespeichert wird, daher werden wir hier sehen, wie sie verwendet wird.

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

Die Methode save wird überschrieben, was bedeutet, dass Sie einer bereits vorhandenen Elternmethode neue Funktionen hinzufügen. Es sagt Django im Grunde, dass jedes Mal, wenn ein „Shortener“-Objekt gespeichert wird und die short_url nicht angegeben wird, es mit einem zufälligen Code gefüllt werden muss.

Ausführen von Migrationen

Jetzt ist es an der Zeit, die Migrationen des Shortener-Modells durchzuführen und auszuführen. Führen Sie dazu die folgenden Befehle im Stammprojektordner aus.

 $ 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

Im Moment müssen Sie sich keine Gedanken darüber machen, was Migrationen sind. Denken Sie nur daran, dass Django beim Ausführen dieser beiden Befehle eine db.sqlite-Datenbankdatei basierend auf den von Ihnen definierten Modellen erstellt.

Lassen Sie uns einige Objekte mit der Django-Shell erstellen.

 $ 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

So funktionieren alle Shortener-Objekte.

Ansichten schreiben

Wie ich bereits sagte, ist eine Ansicht eine einfache Funktion, die eine Anfrage entgegennimmt und eine Antwort zurückgibt. Sehen wir uns also an, wie Sie ein Hallo-Weltbild erstellen.

Grundlegende Vorlagenantwort

Erstellen Sie in der Datei „urlshortener/views.py“ eine Funktion 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")

Es gibt eine einfache Nachricht „Hallo Welt“ zurück. Später sehen Sie, wie es im Browser aussieht. Erstellen Sie nun eine „urls.py“, dort stehen alle URL-Muster der App.

touch urls.py

Fügen Sie den folgenden Code hinzu.

 ''' 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") ]

Die Variable appname deklariert (wie der Name schon sagt) den Namespace der URL-Shortener-App.

Um es schnell zu erklären, importieren wir die Pfadfunktion, die ein Element zurückgibt, das in die URL-Muster der App aufgenommen werden soll. Das name- Attribut ist der Namespace des Pfades, der bei Bedarf innerhalb von Templates aufgerufen werden kann.

Lassen Sie uns nun die gesamten Projekt-URLs ändern.

 # 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')) ]

Lassen Sie uns nun den Server erneut ausführen.

 python manage.py runserver

Wenn Sie den Server ausführen, erhalten Sie eine einfache „Hello world“-Nachricht. Dies liegt daran, dass Sie die URL-Muster aus der URL-Shortener-App in das Gesamtprojekt einbeziehen.

Dies ist nur ein Ausgangspunkt. Jetzt ist es an der Zeit, ein Formular zu erstellen, mit dem der Benutzer verkürzte URLs selbst erstellen kann.

Formulare erstellen

In Django ist ein Formular eine einfache Klasse, die es ermöglicht, Eingaben vom Benutzer zu erhalten.

Sie werden eine forms.py-Datei erstellen. Es ist eine Konvention, alle Formulare der App in dieser Datei zu speichern.

 cd urlshortener/ touch forms.py

Innerhalb dieser Datei werden Sie eine Klasse „ShortenerForm“ erstellen, die sich von „ModelForm“ erweitert.

 ''' 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',)

Es ist ein Modellformular, da es dazu dient, ein Modellobjekt aus der Benutzereingabe zu erstellen. Wir verwenden auch das Widget-Argument, mit dem wir das Attribut „class“ (Klasse in CSS, nicht Python) angeben können. Dies liegt daran, dass wir die App später mit Bootstrap stilisieren werden.

Ansichten fertigstellen

Nach dem Erstellen der Formulare ist es an der Zeit, die endgültige Geschäftslogik der Anwendung zu erstellen.

Navigieren Sie zur Datei views.py in der views.py App und ändern Sie die Ansicht home_view . Sie können sich in diesem Moment das Github-Repository ansehen, um eine Vorstellung davon zu bekommen, wie die Projektstruktur aussieht.

Es gibt zwei Ansichten für die URL-Shortener-App:

  1. Home-Ansicht: Dies zeigt das Shortener-Formular und die neue URL, wenn das Formular bereits gesendet wurde.
  2. Umleitungsansicht: Dies leitet auf die lange URL um und fügt 1 zu den folgenden Zeiten hinzu.

Beginnen wir mit der Home-Ansicht, die am komplexesten ist. Sie müssen das Shortener-Modell und das Formular importieren. Sie verwenden immer noch eine Funktion, da ich möchte, dass Sie den gesamten Datenfluss der Ansicht verstehen. Außerdem verwenden Sie den Pfad für eine Vorlage (die noch nicht erstellt wurde).

Home-Ansicht

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

Die Ansicht basiert auf zwei Bedingungen:

  1. Wenn die HTTP-Methode gleich GET ist: Wir übergeben nur als Kontext das Shortener-Formular, das zum Erstellen von Shortener-Objekten verwendet wird.
  2. Wenn die HTTP-Methode gleich POST ist: Wir übergeben das Formular immer noch im Kontext, da wir möchten, dass der Benutzer eine andere URL eingeben kann. Aber wir übergeben die Post-Anfrage an ein anderes Formular namens used_form.

Eine schwierige Möglichkeit, die vollständige Site-URL dynamisch build_absolute_uri besteht darin, die Anforderungsobjektmethode build_absolute_uri .

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

Um eine falsche Anfrage (der Benutzer hat keine gültige URL eingegeben) sicher zu verarbeiten, erhalten wir die Formularfehler, übergeben sie als Kontext und rendern die Vorlage wie gewohnt. Später sehen Sie, wie Sie die Fehleranzeige in der Vorlage implementieren.

Ansicht umleiten

Die redirect_url_view ist etwas einfacher. Es handelt sich um eine Detailansicht, dh die Ansicht funktioniert nur mit einem Objekt.

Diese Funktion verwendet als Parameter die Anfrage des Benutzers und den verkürzten_Teil der URL. Es ist nicht erforderlich, die Art der Anfrage anzugeben, die wir erhalten, da wir in dieser Ansicht nicht mit Formularen arbeiten.

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

Wir schützen die Ansicht mit einer try/except- Anweisung, falls der gekürzte Teil nicht in der Datenbank gefunden wird. Wenn das Objekt gefunden wird, fügt es 1 zum Feld times_followed und leitet mit der HttpResponseRedirect Funktion an die Site-URL um, die dem Zufallscode entspricht.

URLs aktualisieren

Nachdem Sie die beiden Ansichten der App erstellt haben, ist es an der Zeit, die endgültigen URL-Muster zu erstellen, indem Sie den Pfad zu redirect_url_view einschließen.

Wie immer beginnen Sie damit, die Ansichten zu importieren, dann eine Pfadfunktion zu erstellen und als Argumente zu übergeben:

  • Die URL-Route
  • Der Blick auf den Weg
  • Der Name des Weges
 ''' 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'), ]

Mit dieser URL-Einrichtung sieht das Routing der App so aus.

  • localhost:8000/ : Home-Ansicht
  • localhost:8000/URL-code : Umleitung auf die lange URL

Vorlagen erstellen

Du bist fast am Ziel. Das einzige, was Sie davon trennt, diese App erstellt zu haben, ist die Benutzeroberfläche. Dafür verwenden wir Django-Vorlagen.

Vorlagen werden verwendet, um dem App-Benutzer eine saubere Oberfläche zu bieten. Diese Dateien werden innerhalb der App in einer doppelten Ordnerstruktur der Form erstellt: „templates/appname“

 # urlshortener directory mkdir -p templates/urlshortener/

Hinweis: Die doppelte Ordnerstruktur und die Django-Vorlagensprache würden den Rahmen dieses Tutorials sprengen, aber Sie können sie in der offiziellen Dokumentation nachlesen.

Basisvorlage

Django ermöglicht die Vorlagenvererbung. Dies bedeutet, dass wir eine Basisvorlage haben und diese mit dem Ziel erweitern können, dem DRY-Prinzip (Don't repeat yourself) zu folgen.

 cd templates/urlshortener touch base.html

Die Datei base.html ist eine Konvention und bedeutet, dass jede andere Vorlage in der App eine Erweiterung dieser Vorlage sein muss.

 <!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>

Wir werden das Bootstrap-CDN verwenden, um eine schnelle und hübsche Benutzeroberfläche zu erstellen, ohne CSS- oder Javascript-Dateien zu benötigen.

Wenn Sie mehr über DTL-Tags erfahren möchten, können Sie dies mit den offiziellen Dokumenten tun.

Home-Vorlage

Die Home-Vorlage, die aus der Datei base.html stammt. Das bedeutet, dass diese Vorlage den gesamten HTML-Code der übergeordneten Datei enthält.

 {% 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 %}

Ich erkläre kurz den Datenfluss dieser Vorlage:

  • Das Shortener-Formular wird angezeigt. Darin wird das crsf-Token gesetzt (Sicherheitsgründe), und nur das lange URL-Feld des Formulars wird angezeigt. Denken Sie daran, dass dieses Feld die CSS-Klasse „form-control form-control-lg“ hat, da wir dies im Formular festgelegt haben.
  • Wenn Fehler gefunden werden, zeigen Sie diese an
  • Wenn der POST-Vorgang erfolgreich ist, wird die neue URL angezeigt.

Endgültige Bewerbung

Herzliche Glückwünsche! . Sie haben mit Django eine vollständig funktionsfähige URL-Shortener-App erstellt.

Hier sind einige Screenshots, wie die Anwendung aussieht.

Erhalten Sie nur:

Fehler beim Kürzen der URL:

Erfolgreiche verkürzte URL:

Erfolg mit Django URL Shortener

URL umgeleitet:

Erfolgsweiterleitung

Was halten Sie davon, jemandem eine Demo dieser URL-Shortener-App zur Verfügung zu stellen? Überprüfen Sie, wie Sie eine Django-Demo-App dem Internet zugänglich machen.

Herausforderung

Wenn Sie sich mit Ihren Django-Fähigkeiten wohl fühlen, warum üben Sie nicht mit einer Herausforderung?

Klonen Sie den Code dieser Anwendung und erstellen Sie ein Authentifizierungssystem, bei dem nur registrierte Benutzer ihre URLs kürzen können.

Wenn Sie fertig sind, senden Sie einen Pull-Request und pingen Sie mich auf Twitter an, um Ihre Erfolge zu präsentieren.

Einpacken

Sie haben das Ende dieses Tutorials erreicht. Ob Sie es glauben oder nicht, Sie haben gerade alle Hauptaspekte der Erstellung eines Django-Projekts überprüft. Ich hoffe, Sie fanden es sehr nützlich.

In diesem Tutorial haben Sie:

  • Erfahren Sie mehr über den Workflow zum Erstellen einer Django-App.
  • Ein Lebenslaufprojekt erstellt
  • Die Unterschiede und die Struktur von Django-Projekten und Django-Apps verstanden.
  • Entdeckte das MVT-Muster.
  • Erstellte Funktionsbasisansichten
  • Verwendet den Django ORM (Object Relational Mapper), um einfache Modelle zu erstellen

Das ist alles, mit dem Django-Web-Framework gibt es eine Menge abzudecken. Bleiben Sie also in Kontakt, um weitere erstaunliche Tutorials zu erhalten.