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

Der beste Weg, Django oder andere Fähigkeiten zu erlernen, besteht darin, Ihr vorhandenes Wissen anzuwenden, indem Sie funktionale Projekte erstellen.

Django ist das am häufigsten verwendete Python-Framework für die Webentwicklung. Seine integrierten Funktionen und die umfangreiche Anzahl von Paketen von Drittanbietern haben es zu einem der beliebtesten Web-Frameworks auf der ganzen Welt gemacht.

Es ist schnell, zuverlässig und hat 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 Django-allauth, mit dem Sie Benutzer mit ihren sozialen Konten registrieren können.

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

Heute werden Sie also von Grund auf eine voll funktionsfähige Django-Anwendung erstellen.

Am Ende dieses Tutorials werden Sie:

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

Voraussetzungen

Alle folgenden Anforderungen sind optional und helfen Ihnen, dem Tutorial zu folgen. Aber wenn Sie keine Erfahrung mit diesen haben, machen Sie sich keine Sorgen. Der wichtigste Schritt ist der erste.

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

Der gesamte Arbeitscode wird darauf verfügbar sein Github-Repository.

Nun, da Sie die vorherigen Konzepte kristallklar haben, lassen Sie uns in die Materie einsteigen.

Projektaussage

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

Wenn Sie beispielsweise einen Tweet teilen und einen Link zu Ihrer Website einfügen möchten, aber mit der Zeichenbeschränkung konfrontiert sind, können Sie einen URL-Shortener verwenden.

Lassen Sie es uns mit einer Grafik sehen.

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

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

Struktur eines Django-Projekts

Grundsätzlich basiert eine Django-Website auf einem einzigen Projekt und mehreren separaten Apps. Jede dieser Apps hat spezifische Funktionen und kann für sich alleine arbeiten.

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

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

Entsprechend der Struktur der Django-Website würde das Projekt StackOverflow heißen, das zwei Haupt-Apps hat. Die Benutzer-App und die Forum-App.

Jede dieser Apps verfügt über eigenständige Funktionen. Das bedeutet, dass beide den gesamten Code enthalten, den sie benötigen, um ordnungsgemäß zu funktionieren.

Dazu gehören Modelle (Datenbankstruktur), Ansichten (Anfragen und Antworten), bestimmte URL-Muster und natürlich Vorlagen und statische Dateien (Bilder, CSS, JavaScript). Dies bedeutet, dass jede Django-App wiederverwendet werden kann, da sie in der Lage ist, von selbst zu arbeiten.

Kurz gesagt bezieht sich ein Projekt auf eine Reihe von Konfigurationen und Apps, die dazu bestimmt sind, eine Webanwendung zu erstellen. Andererseits ist eine Django-App Teil eines Projekts, das in sich geschlossen ist (alles hat, was es zum Funktionieren braucht), und dessen Zweck es ist, eine bestimmte Operation auszuführen.

Richten Sie ein Django-Projekt ein

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, mit zu arbeiten virtuelle Umgebungen beim Erstellen von Apps mit Django. Dies ist die effizienteste Methode, um einen bestimmten Satz von Abhängigkeiten beizubehalten. Sein Hauptzweck besteht jedoch darin, die Entwicklungspakete von den globalen zu isolieren.

Lassen Sie uns also eine virtuelle Umgebung mit Python, dem integrierten Formularbefehl, erstellen.

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. Grundsätzlich 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 virtuellen Umgebungsnamen .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 Sie keine Pakete im neuen venv installiert haben, führen Sie aus.

pip freeze

Wenn Sie die virtuelle Umgebung korrekt 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, beginnen wir mit der Installation des Django-Pakets. 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 verlaufen ist, überprüfen wir erneut die installierten Pakete unseres venv.

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

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

Starten eines Django-Projekts

Nachdem Sie Django installiert haben, ist es an der Zeit, die Struktur der URL-Shortener-Website zu erstellen. Erinnern Sie sich, was ein Django-Projekt ist? Lassen Sie uns eine erstellen, indem Sie den folgenden Befehl ausführen.

django-admin startproject config

Um alles über diesen Befehl zu erklären, ist django-admin ein Befehlszeilendienstprogramm, das alle erforderlichen Aufgaben zum Erstellen eines Django-Projekts ausführt. Der Teil „startproject“ 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 dieses Projekts verwende, ist einfach der Bequemlichkeit halber. Es ist schön, zwischen Projekten zu wechseln und immer noch die gleiche Namenskonvention zu haben. Scheuen Sie sich also nicht, jederzeit andere Projektnamen zu verwenden.

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 seiner Verwendung besteht darin, dass Sie die Einstellungen verwalten können, wenn Sie das Projekt ausführen.

  Die Top 5 der klassischen Koop-Spiele mit modernen Remakes

Jetzt schauen wir mal, ob alles richtig funktioniert.

python manage.py runserver

Erstellen der URL-Shortener-App

Es ist an der 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 die ausführen Baum Befehl 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 Moment erstellt wurden. „config“ ist der Name unseres Projekts und es wurde nur für die Convention so benannt. Innerhalb von config erhalten Sie settings.py, das ist 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 allzu großen Sorgen um die Dateien asgi.py und wsgi.py. Dies sind Dateien, mit denen Sie Ihre Anwendung in der Bereitstellung konfigurieren können.

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

Wenn Sie einen Blick in urlshortener werfen, was der Name der App ist, die Sie gerade erstellt haben, werden Sie vielleicht 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 spielt man nicht damit herum, außer man macht ziemlich vorausschauende Sachen.

In admin.py registrieren Sie Ihre Modelle, um sie im Django-Admin-Panel sichtbar zu machen.

models.py ist die wichtigste. Innerhalb dieses Moduls müssen Sie die Modelle definieren, die (vage ausgedrückt) die Art und Weise darstellen, wie die Daten gespeichert werden. Sie werden später mehr über Modelle hören.

migrations/ ist der Ordner, in dem Django-Migrationen gespeichert werden. Wir werden uns später eingehend damit befassen.

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. Grundsätzlich 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 urlshortener-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 Routineprozess, wenn Sie eine App erstellen. Vergessen Sie also jedes Mal nicht, es in den Projekteinstellungen zu installieren.

Das MVT-Muster verstehen

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

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 sind in ihrer einfachsten Form Callables, die eine Anfrage des Benutzers entgegennehmen und eine Antwort generieren. Dazwischen liegt die Geschäftslogik. 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-Vorlagensprache (DTL) wodurch Sie etwas von 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 uns daran machen, den Django-URL-Shortener von Grund auf neu zu erstellen.

Lassen Sie uns zunächst das Shortener-Modell in der Datei „models.py“ definieren.

'''
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 passieren, aber verzweifeln Sie nicht. Ich gehe Schritt für Schritt auf jede wichtige Sache ein.

Modellerklärung

Zunächst 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, fällt zunächst auf, dass es die Modelle erweitert.Modell. Tatsächlich muss jedes Modell in jeder Django-App eine Unterklasse von sein Modelle.Modell Klasse.

Dann definieren wir alle Felder, die das Modell in der Datenbank haben wird. Das Feld „erstellt“ ist das Datum und die Uhrzeit der Erstellung des verkürzten Links, 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 geändert wird, wenn die Instanz erstellt 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.

Andererseits bezieht sich long_url auf die URL, die der Benutzer eingibt. Es ist ein URLField, weil wir möchten, dass der Benutzer nur Zeichen der Form eingibt: 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 es keine wiederholten Elemente in diesem Feld geben darf. Schließlich weisen wir darauf hin, dass es leer gelassen werden kann, was bedeutet, dass Benutzer beim Arbeiten mit Formularen keinen eigenen Kurzcode 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__ gibt an, wie das Modell gedruckt werden muss. Wenn wir also ein Objekt mit long_url = „https://wdzwdz.com/“ und verkürztem Teil „123456“ haben, drucken wir es aus.

https://wdzwdz.com/ to 123456

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

  So fügen Sie Beschriftungen in Microsoft Excel-Diagramme ein

Verkürzungsfunktion erstellen

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

touch utils.py

Innerhalb dieser Datei verwenden wir die Auswahlfunktion aus dem zufälligen integrierten 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 können, gibt diese Funktion eine zufällige Zeichenfolge mit der in der Einstellungsdatei angegebenen Länge oder standardmäßig 7 zurück. Sie verwenden die Funktion getattr, um eine Variable aus dem Einstellungsmodul abzurufen, ohne jedoch 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, ist das möglich Permutationen sind:

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

Obwohl es so viele Permutationen geben kann, besteht eine geringe Wahrscheinlichkeit, wiederholt verkürzte Teile zu erhalten. Dies ist ein Problem, da wir das shortened_url-Feld so eingerichtet haben, dass es eindeutig ist. 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 nimmt als Argument eine „Shortener“-Modellinstanz. Zuerst generiert die Funktion einen Zufallscode unter Verwendung von create_random_code. Dann ruft es die Modellklasse ab und prüft, ob es ein anderes Objekt mit derselben short_url gibt. Wenn dies der Fall ist, führt es sich noch einmal aus, 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 genau anzusehen.

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

Ändern der Speichermethode

Am Ende der „Shortener“-Klasse ändern Sie die Methode zum Speichern des Modells. Die save-Methode 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 Speichermethode wird überschrieben, was bedeutet, dass Sie einer bereits vorhandenen übergeordneten Methode neue Funktionen hinzufügen. Es teilt Django im Grunde mit, dass jedes Mal, wenn ein „Shortener“-Objekt gespeichert wird und die short_url nicht angegeben ist, es mit einem zufälligen Code gefüllt werden muss.

Migrationen ausführen

Jetzt ist es an der Zeit, die Migrationen des Shortener-Modells vorzunehmen 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-Datenbank Datei, basierend auf den von Ihnen definierten Modellen.

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

$ python manage.py shell

>>> from urlshortener.models import Shortener
>>> s = Shortener(long_url="https://wdzwdz.com")
>>> s.short_url
''
>>> s.save()
>>> s.short_url
'kdWFVIc'
>>> s.long_url
'https://wdzwdz.com'
>>> print(s)
https://wdzwdz.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 man eine Hallo-Welt-Ansicht erstellt.

Grundlegende Vorlagenantwort

Erstellen Sie in der Datei „urlshortener/views.py“ eine Funktion home_view. äh

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

Berühren Sie 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 appname-Variable deklariert (wie der Name schon sagt) den Namensraum der URLShortener-App.

Schnell erklärend, dass wir die importieren Pfadfunktion, das 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 selbst verkürzte URLs erstellen kann.

Formulare erstellen

In Django, a bilden ist 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 erstellen Sie eine Klasse „ShortenerForm“, die sich von „ModelForm“ erstreckt.

'''
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 sein Zweck darin besteht, ein Modellobjekt aus der Benutzereingabe zu erstellen. Wir verwenden auch das Widget-Argument, mit dem wir das Attribut „Klasse“ (Klasse in CSS, nicht Python) angeben können. Dies liegt daran, dass wir die App später mit Bootstrap stilisieren werden.

Abschluss der Ansichten

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 Shortener-App und ändern Sie die Ansicht home_view. Sie können die überprüfen Github-Repository in diesem Moment, um sich ein Bild davon zu machen, wie die Projektstruktur aussieht.

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

  • Startansicht: Dies zeigt das verkürzte Formular und die neue URL, wenn das Formular bereits gesendet wurde.
  • Umleitungsansicht: Dies leitet auf die lange URL um und fügt 1 zu den gefolgten Zeiten hinzu.
  •   So kündigen Sie Ihr HBO Max-Abonnement

    Beginnen wir mit der Home-Ansicht, die die komplexeste ist. Sie müssen das Shortener-Modell und -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:

  • Wenn die HTTP-Methode gleich GET ist: Wir übergeben nur als Kontext das Shortener-Formular, das zum Erstellen von Shortener-Objekten verwendet wird.
  • 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-Anforderung an ein anderes Formular namens used_form.
  • Eine knifflige Methode, um die vollständige Site-URL dynamisch zu erhalten, ist die Verwendung der Anforderungsobjektmethode build_absolute_uri .

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

    Als sichere Möglichkeit, eine falsche Anfrage zu verarbeiten (der Benutzer hat keine gültige URL eingegeben), erhalten wir die Formularfehler, übergeben sie als Kontext und rendern die Vorlage wie gewohnt. Später sehen Sie, wie Sie die Fehleranzeige im Template implementieren.

    Ansicht umleiten

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

    Diese Funktion nimmt als Parameter die Anfrage des Benutzers und den verkürzten_Teil der URL. Es ist nicht erforderlich, die Art der Anfrage zu bestätigen, 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 dem Feld times_followed eine 1 hinzu und leitet mit der HttpResponseRedirect-Funktion an die Website-URL weiter, die dem Zufallscode entspricht.

    Aktualisieren von URLs

    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“ einfügen.

    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 Pfads
    '''
    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 diesem URL-Setup sieht das Routing der App so aus.

    • localhost:8000/: Startansicht
    • 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 „Vorlagen/Appname“ erstellt.

    # 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 darüber in der amtliche Dokumentation.

    Basisvorlage

    Django erlaubt Template-Vererbung. Das bedeutet, dass wir eine Basisvorlage haben und diese erweitern können, um dem DRY-Prinzip (Don’t repeat yourself) zu folgen.

    cd templates/urlshortener
    touch base.html

    Die base.html-Datei ist eine Konvention und bedeutet, dass jede andere Vorlage in der App eine Erweiterung dieser 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 Schnittstelle zu erstellen, ohne CSS- oder Javascript-Dateien zu benötigen.

    Wenn Sie mehr über DTL-Tags erfahren möchten, können Sie dies mit dem tun offizielle Dokumente.

    Home-Vorlage

    Das Home-Template, Vererbung aus der base.html-Datei. 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. Drinnen, die 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, weil wir das im Formular festlegen.
    • Wenn Fehler gefunden werden, zeigen Sie diese an
    • Wenn die POST-Operation 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.

    Nur erhalten:

    Fehler beim Kürzen der URL:

    Erfolgreiche verkürzte URL:

    URL umgeleitet:

    Was halten Sie davon, jemandem eine Demo dieser URL-Shortener-App zu zeigen? Erfahren Sie, wie Sie eine Django-Demo-App im Internet verfügbar 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 eine Pull-Anfrage und pingen Sie mich an Twitter 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 äußerst nützlich.

    In diesem Tutorial:

    • Erfahren Sie mehr über den Arbeitsablauf beim Erstellen einer Django-App.
    • Aufbau eines Lebenslaufprojekts
    • 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, es gibt viel zu decken Django-Webframeworkalso bleiben Sie in Kontakt, um weitere tolle Tutorials zu erhalten.