Verwalten von statischen Dateien in Django: Eine umfassende Anleitung

In diesem Tutorial werden wir uns ansehen, was statische Dateien in Django sind, die Vorteile einer effizienten Verwaltung, ihren Zweck in Webanwendungen und wir werden ein Demo-Projekt einrichten, um zu zeigen, wie man statische Dateien mit verschiedenen Methoden und Werkzeugen verwaltet und bereitstellt.

Django ist ein hochleveliges Python-Webentwicklungsframework, das Webentwicklern ein leistungsfähiges Werkzeug zur schnellen und effizienten Erstellung von Webanwendungen bietet.

Obwohl Django großartig für die schnelle und effiziente Erstellung von Webanwendungen ist, ist es genauso wichtig, auf das Erscheinungsbild und die Handhabung der entwickelten Webanwendungen zu achten. Um das zu tun, müssen Sie lernen, wie Sie die Assets verwalten, die das Erscheinungsbild und die Handhabung Ihrer Anwendungen unterstützen und bereitstellen.

Statische Dateien in Django

In Django sind statische Dateien jene Dateien, die direkt an den Client ohne Verarbeitung durch den Server geliefert werden.

Dazu gehören typischerweise CSS, JavaScript-Dateien, Bilder, Symbole, Schriftarten und andere Assets, die für das Erscheinungsbild und die Handhabung Ihrer Webanwendung notwendig sind.

Django bietet Mechanismen zur effizienten Verwaltung und Bereitstellung dieser statischen Dateien, um eine reibungslose Benutzererfahrung sicherzustellen.

Effiziente Verwaltung von statischen Dateien

Um sicherzustellen, dass die Benutzer Ihrer Webanwendung eine gute Benutzererfahrung haben und die Anwendung wie erwartet funktioniert, müssen Sie die statischen Dateien effizient verwalten.

Die ordnungsgemäße Organisation und Zwischenspeicherung von statischen Dateien stellt schnelle Ladezeiten von Seiten sicher und verbessert die Reaktionsfähigkeit, was zu einer insgesamt höheren Benutzerzufriedenheit führt.

Django bietet verschiedene Werkzeuge und Konventionen zur Unterstützung bei der Handhabung von statischen Dateien.

Der Zweck von statischen Dateien in Webanwendungen

Statische Dateien sind sehr wichtig, da sie festlegen, wie eine Webanwendung aussieht und sich anfühlt. Sie definieren, wie Komponenten in einer Anwendung gestaltet sind, wie sie auf Benutzerinteraktionen reagieren und schließlich, was ein Benutzer sieht, wenn er eine bestimmte Webanwendung besucht.

Wenn Sie statische Dateien effizient bedienen, können Sie eine optisch ansprechende und reaktionsfähige Benutzeroberfläche erstellen, was die Anwendung interaktiver und benutzerfreundlicher macht.

Einrichten eines Demo-Projekts

Um die Konzepte der Verwaltung statischer Dateien in Django zu veranschaulichen, werden wir ein Demo-Projekt von Grund auf aufbauen.

Dieses Projekt umfasst die Erstellung eines Django-Projekts, die Konfiguration von Einstellungen für statische Dateien und die Integration von statischen Dateien in eine einfache Webanwendung.

Indem Sie dem Demo-Projekt folgen, erhalten Sie praktische Erfahrungen bei der Verwaltung von statischen Dateien in Django und verstehen die Bedeutung von ihnen in der Webentwicklung.

Zwecks dieses Tutorials werden wir eine Landing Page erstellen, so dass Benutzer, die die Startseite unseres Projekts besuchen, eine gestylte Überschrift sehen, die sie willkommen heißt. Es wird auch das heutige Datum mithilfe von JavaScript anzeigen, und wir werden auch ein Bild zur Vervollständigung der Seite bereitstellen.

Erstellen eines Verzeichnisses zur Aufnahme des Projekts

Beginnen wir mit der Erstellung eines Verzeichnisses, das das Demo-Projekt aufnehmen wird, unter Verwendung des folgenden Befehls:

mkdir sitepoint_django_static_tut

Erstellen einer virtuellen Umgebung

Es wird empfohlen, neue Projekte in virtuellen Umgebungen zu isolieren. Das bedeutet, dass jedes Projekt seine eigenen Abhängigkeiten hat, ohne die globale Python-Installation zu beeinflussen.

Wir werden das virtualenv-Paket verwenden, um es zu erstellen. Falls es in Ihrer Entwicklungsumgebung nicht installiert ist, installieren Sie es mit pip install virtualenv und erstellen Sie eine virtuelle Umgebung mit folgendem Befehl:

virtualenv myenv

Der obige Befehl erstellt eine virtuelle Umgebung mit dem Namen myenv. Um die virtuelle Umgebung zu verwenden, müssen Sie sie aktivieren:

Linux/macOS:

. myenv/bin/activate

Windows:

. myenv\Scripts\activate

Installation von Abhängigkeiten

Sobald die virtuelle Umgebung aktiv ist, können Sie nun fortfahren und die Abhängigkeiten Ihres Projekts installieren. Zunächst werden wir Django installieren. Wir werden weitere Abhängigkeiten installieren, wenn wir zu den Abschnitten kommen, in denen ihre Verwendung demonstriert wird:

pip install Django

Dies installiert die neueste stabile Version von Django, die zum Zeitpunkt des Schreibens Version 5.0 ist.

Erstellen eines Django-Projekts

Nach erfolgreicher Installation von Django haben Sie nun Zugriff auf Django-Verwaltungsbefehle. Lassen Sie uns diese nutzen, um ein Django-Projekt in der virtuellen Umgebung zu erstellen:

django-admin startproject sitepoint_django .

Der obige Befehl erstellt ein Django-Projekt mit dem Namen sitepoint_django und der Punkt am Ende zeigt an, dass wir das Projekt im aktuellen Verzeichnis erstellen möchten.

Erstellen einer Demo-App

Um die verschiedenen Konzepte der Verwaltung von statischen Dateien zu veranschaulichen, müssen wir in unserem Projekt mindestens eine Django-App erstellen:

python manage.py startapp  static_demo

Dies wird eine neue App in unserem Projekt namens static_demo erstellen. Um sie von unserem Projekt erkennen zu lassen, müssen wir sie in der Einstellung für installierte Apps im settings.py -Datei unseres Projekts hinzufügen. Öffnen Sie sitepoint_django/settings.py, gehen Sie zur Einstellung INSTALLED_APPS und fügen Sie static_demo.apps.StaticDemoConfig ganz unten in die Liste ein, wie unten gezeigt:

# sitepoint_django/settings.py

INSTALLED_APPS = [
    # andere Apps
    'static_demo.apps.StaticDemoConfig',
]

Erstellen des Startseitentemplates

Wir werden einige HTML rendern, wenn der Benutzer die Startseite unserer Website besucht. Erstellen Sie im static_demo -App ein templates Verzeichnis und darin ein weiteres Verzeichnis und benennen Sie es in static_demo. Erstellen Sie in diesem Verzeichnis eine Vorlage und benennen Sie sie in index.html um, sodass der Pfad static_demo/templates/static_demo/index.html lautet.

Fügen Sie den folgenden Code in index.html ein:

<!-- static_demo/index.html -->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sitepoint Django Tutorial</title>
</head>
<body>
    <h2>Hello there, welcome to our great site!</h2>
</body>
</html>

Erstellen der Indexansicht

Damit die Vorlage den Benutzern gezeigt wird, wenn sie die Startseite unserer App besuchen, müssen wir eine Ansichtsfunktion erstellen, die ausgelöst wird, um die home.html -Vorlage zu rendern. Öffnen Sie die static_demo/views.py -Datei und fügen Sie den folgenden Code ein:

# static_demo/views.py

from django.shortcuts import render

def index(request):
    return render(request, "static_demo/home.html")

Erstellen der statischen_demo-URL-Datei

Wir möchten, dass die Indexansicht im static_demo-App die Startseite rendert, wenn ein Benutzer unsere Website besucht. Dafür müssen wir einen URL-Schema für die Ansichtsfunktion erstellen, die die Startseite rendert. Dazu benötigen wir eine urls.py-Datei für die static_demo-App und verbinden dann die static_demo-URL-Datei mit der Projekt-URL-Datei.

Folglich erstellen wir in der static_demo-App eine Datei und nennen sie urls.py und fügen den folgenden Code hinzu:

# static_demo/urls.py

from django.urls import path
from .import views

app_name = 'static_demo'

urlpatterns = [
    path('', views.index, name="index"),
]

Der obige Code erstellt eine URL für die Indexansicht unseres Projekts, sodass, wenn ein Benutzer etwas wie http://oursite.com/ besucht, oder wenn Sie http://127.0.0.1:8000 im Entwicklungsmodus besuchen, die Indexansicht aufgerufen wird, um auf diese zu reagieren.

Fügen wir es der Projekt-URL-Datei hinzu. Öffnen Sie die sitepoint_django/urls.py-Datei und fügen Sie den folgenden Code ein:

# sitepoint_django/urls.py

from django.contrib import admin
from django.urls import path, include # fügen Sie eine Importanweisung für include hinzu

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('static_demo.urls')), # fügen Sie diese Zeile hinzu
]

Der obige Code ändert die Standard-urls.py-Datei. Wir haben eine Importanweisung für die include-Funktion hinzugefügt, die Django mitteilt, dass wir die static_demo.urls einbeziehen.

Projekt testen

Die erste Konfiguration des Projekts ist an diesem Punkt abgeschlossen. Lassen Sie uns den Entwicklungsserver starten, um zu sehen, ob alles gut zusammenhängt.

Führen Sie das Projekt mit folgendem Befehl aus:

python manage.py runserver

Wenn alles korrekt eingerichtet ist, sollten Sie die Möglichkeit haben, auf http://127.0.0.1:8000 zu besuchen. Dort sehen Sie einige ungestaltete Texte, die Ihnen willkommen heißen.

Das Bereitstellen statischer Dateien in der Entwicklung

Um der Seite Stil, JavaScript für das Datum und das Bild hinzuzufügen, müssen wir Änderungen am Projekt vornehmen. Lassen Sie uns dies schrittweise tun und sehen, wie wir die verschiedenen statischen Dateien auf unterschiedliche Weisen bereitstellen können, beginnend mit der Entwicklungsumgebung.

Einrichten eines Verzeichnisses für statische Dateien

Django empfiehlt, dass alle statischen Assets nach Anwendung (appwise) verwaltet werden: Das bedeutet, dass alle CSS-, JS- und Bilddateien, die eine bestimmte Anwendung benötigt, innerhalb des Bereichs dieser Anwendung verbleiben sollten. Also aktualisieren wir die static_demo-Anwendung und erstellen ein Verzeichnis namens static, und darin erstellen wir ein weiteres Verzeichnis namens static_demo. Dann erstellen wir im static_demo-Verzeichnis drei weitere Verzeichnisse: css, js und images. Am Ende haben wir eine Struktur, die der folgenden ähnelt:

static_demo/
    └── static/
        └── static_demo/
            ├── css/
            ├── js/
            └── images/

Der Grund, warum Sie ein static_demo-Verzeichnis im static-Verzeichnis erstellen möchten, ist, um Ihre statischen Assets zu benennen. Wenn Sie mehr als eine Anwendung haben und das CSS in beiden Anwendungen als styles.css benannt ist, würde Django nur die erste Stylesheet-Datei finden und verwenden, da es nicht in der Lage wäre, die anderen zu unterscheiden. Daher benennen wir sie, damit Django erkennen kann, welche Asset-Datei wir in unseren Vorlagen referenzieren.

Erstellen der statischen Dateien

In diesem Schritt richten wir einfach minimale statische Assets ein, die zeigen, wie Sie Dateien im Entwicklungsmodus bereitstellen können.

Erstellen Sie im Verzeichnis js eine Datei und nennen Sie sie todays_date.js, und fügen Sie den folgenden Code hinzu:

/* static_demo/js/todays_date.js */

let formattedDate = new Date().toLocaleDateString();

document.getElementById('todaysDate').innerText = `The date today is ${formattedDate}`;

Der obige Code ruft das heutige Datum aus JavaScript ab, formatiert es in einen String und zeigt es dann in einer Div mit der ID todaysDate an.

Erstellen Sie im Verzeichnis css eine Datei, nennen Sie sie styles.css, und fügen Sie den folgenden Code hinzu:

/* static_demo/css/styles.css */

body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0;
}

h2 {
    font-size: 24px; 
    color: green;
}

Der obige Code verwendet das Flexbox-Layout, um alle Elemente auf der Seite sowohl horizontal als auch vertikal zentrieren. Er setzt außerdem die Schriftgröße des H2-Elements auf 24px und die Farbe auf grün.

Für das Bild können Sie ein beliebiges Bild verwenden. Kopieren Sie einfach ein Bild in das Verzeichnis images und notieren Sie sich den Namen.

Konfigurieren der statischen Dateieinstellungen

Um statische Dateien im Entwicklungsmodus bereitzustellen, müssen in der Django-Datei settings.py eine Reihe von Einstellungen vorgenommen werden. Öffnen Sie die Datei sitepoint_django/settings.py und überprüfen Sie, ob die folgenden Einstellungen vorhanden sind:

# sitepoint_django/settings.py`

DEBUG=True

Bei der Entwicklung wird grundsätzlich empfohlen, DEBUG in Ihren Django-Projekteinstellungen auf True zu setzen. Diese Einstellung aktiviert verschiedene Debug-Funktionen, einschließlich detaillierter Fehlermeldungen und Stapelüberwachungen, die unerlässlich sind für die Diagnose und Behebung von Problemen während der Entwicklung.

Darüber hinaus serviert die django.contrib.staticfiles-App automatisch statische Dateien aus dem static-Verzeichnis jedes Apps, wenn DEBUG auf True gesetzt ist. Dieses Verhalten vereinfacht den Entwicklungsprozess, indem es die Notwendigkeit zur manuellen Konfiguration zur Bereitstellung von statischen Dateien beseitigt.

Überprüfen Sie in der INSTALLED_APPS-Einstellung, ob die django.contrib.staticfiles hinzugefügt wurde. Falls nicht, fügen Sie sie über den Apps, die Sie im Projekt haben, hinzu. Zum Beispiel fügen Sie sie in diesem Projekt über dem static_demo-App-String hinzu, wie unten gezeigt:

# sitepoint_django/settings.py`

INSTALLED_APPS = [

    'django.contrib.staticfiles',
    'static_demo.apps.StaticDemoConfig',
]

Die von Django bereitgestellte django.contrib.staticfiles-App ist für das Servieren von statischen Dateien während der Entwicklung unerlässlich. Standardmäßig durchsucht sie Ihr Projekt-Apps, um statische Dateiverzeichnisse in jedem App zu finden. Falls Sie jedoch zusätzliche statische Assets haben, die keinem bestimmten App zugeordnet sind, können Sie sie immer noch über die django.contrib.staticfiles-App zugänglich machen, indem Sie die STATICFILES_DIRS-Einstellung in Ihrem Projekt-settings.py-Datei setzen. Diese Einstellung ermöglicht es Ihnen, zusätzliche Verzeichnisse anzugeben, in denen statische Dateien gespeichert sind. Zum Beispiel:

# sitepoint_django/settings.py`

STATICFILES_DIRS = [
    "/dir/with/staticfiles/static",
    "/someother/dir/static",
    "/home/example.com/static",
]

Neben DEBUG und STATICFILES_DIRS ist eine weitere wichtige Einstellung, die Sie in Ihrer Django-Projekt-Einstellungsdatei einbeziehen sollten, STATIC_URL. Während Django einen Standardwert für STATIC_URL bereitstellt, können Sie ihn in Ihrer settings.py Datei explizit definieren, falls er noch nicht vorhanden ist.

Die STATIC_URL Einstellung gibt die Basis-URL an, von der statische Assets bereitgestellt werden. Zum Beispiel weist die Einstellung STATIC_URL = "static/" Django an, statische Assets von der URL-Pfad /static/ zu servieren. Dies bedeutet, dass beispielsweise die Styles-Datei, die sich im static_demo App befindet, über eine URL wie http://127.0.0.1:8000/static/static_demo/css/styles.css zugänglich ist.

Aktualisieren des Templates

Um die statischen Dateien im Template zu verwenden, müssen wir es mit dem folgenden HTML aktualisieren:

<!-- static_demo/index.html -->

<!-- Funktionalität zur Handhabung statischer Dateien hinzufügen -->
{% load static %}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sitepoint Django Tutorial</title>

    <!-- Verknüpfung zur CSS Datei unten -->
    <link rel="stylesheet" href="{% static 'static_demo/css/styles.css'%}"> 
</head>
<body>
    <h2>Hello there, welcome to our great site</h2>
    <p id="todaysDate"></p>
    <!-- Verknüpfung zur Bilddatei unten -->
    <img src="{% static 'static_demo/images/flowerImage.png' %}" alt="Flower Image"> 

    <!-- Verknüpfung zur JS Datei unten -->
    <script src="{% static 'static_demo/js/todays_date.js' %}"></script>
</body>
</html>

Diese Templateaktualisierung führt uns zu einem neuen Tag: {% load static %}. Dieser Tag lädt die Funktionalität zur Handhabung statischer Dateien, die vom Django-Vorlagengerät bereitgestellt wird. Das Einbinden dieses Tags in eine Django-Vorlagendatei ermöglicht es uns, Vorlagentags und Filter im Zusammenhang mit statischen Dateien zu verwenden.

Zum Beispiel ermöglicht es uns, in unserem Template statische Dateien wie Bilder, CSS und JS in HTML-Elementen zu referenzieren. Es ermöglicht Django auch, URLs für die referenzierten statischen Assets zu generieren:

<link rel="stylesheet" href="{% static 'static_demo/css/styles.css'%}"> 

<img src="{% static 'static_demo/images/flowerImage.png' %}" alt="Flower Image"> 

<script src="{% static 'static_demo/js/todays_date.js' %}"></script>

Mit diesen Einstellungen und der Aktualisierung des Templates sollten wir das Projekt ausführen und überprüfen, ob die Dateien im Entwicklungsmodus bereitgestellt werden. Führen Sie das Projekt mit folgendem Befehl aus:

python manage.py runserver

Wenn alles korrekt eingerichtet ist, sollten wir den Entwicklungsserver unter http://127.0.0.1:8000 laufen haben. Wenn wir diesen Link besuchen, sollten wir eine Seite ähnlich der folgenden haben.

Ein ähnliches Bild zeigt, dass die statischen Dateien korrekt angewendet wurden.

Sie sollten beachten, dass in der Django-Entwicklung, wenn DEBUG=True in Ihren Projekteinstellungen und django.contrib.staticfiles aktiviert ist, dies Django ermöglicht, statische Dateien mit dem Entwicklungsserver von Django (runserver) bereitzustellen. In dieser Situation werden Änderungen an statischen Dateien, wie CSS, JavaScript oder Bilder, automatisch von Django erkannt und angewendet. Dieser reibungslose Prozess vereinfacht die Entwicklung erheblich, da Sie sofort die Auswirkungen Ihrer Änderungen sehen, ohne den Server manuell neu starten oder aktualisieren zu müssen.

Allerdings beinhalten Produktionsumgebungen in der Regel die Verwendung eines separaten Webservers oder CDNs zum Bereitstellen statischer Dateien. In diesem Fall werden Änderungen an statischen Dateien möglicherweise nicht automatisch erkannt und von Django angewendet, was eine manuelle Intervention erfordert, um sicherzustellen, dass die aktualisierten Dateien den Benutzern zur Verfügung gestellt werden. Darüber hinaus kann, wenn Sie statische Dateien beispielsweise mit der Ansicht django.views.static.serve() manuell servieren, die automatische Erkennung und Anwendung von Änderungen ausbleiben, und Sie müssen möglicherweise eigene Mechanismen zur Behandlung von Updates für statische Dateien implementieren.

Bereitstellen von statischen Dateien mit WhiteNoise

Im Entwicklungsprozess vereinfacht django.contrib.staticfiles die Bereitstellung von statischen Assets und stellt sicher, dass Änderungen nahtlos aktualisiert werden.

Beim Übergang zur Produktion müssen jedoch Einstellungen wie DEBUG=True deaktiviert werden, und statische Dateien werden möglicherweise von einem CDN oder einem anderen Server bereitgestellt. Dies erfordert eine Lösung, die beide Umgebungen verbindet – die reibungslose Bereitstellung von Dateien während der Entwicklung ermöglicht, während sie die Produktionsumgebung korrekt widerspiegelt.

Tritt das WhiteNoise-Paket hinzu. Entwickelt, um nahtlos mit Django zu integrieren, bietet WhiteNoise eine robuste Lösung für die Bereitstellung von statischen Dateien sowohl in Entwicklungs- als auch in Produktionsumgebungen und stellt einen einheitlichen Ansatz zur Verfügung, der Konsistenz und Zuverlässigkeit über alle Bereitstellungsphasen hinweg gewährleistet. Lassen Sie uns WhiteNoise erkunden.

Installieren und Konfigurieren von WhiteNoise in Django

Der Einstieg in WhiteNoise ist einfach. In diesem Abschnitt führen wir Sie durch den Installationsprozess und zeigen Ihnen, wie Sie WhiteNoise in Ihrem Django-Projekt konfigurieren.

Wir installieren WhiteNoise wie folgt:

pip install whitenoise

Nach erfolgreicher Installation gehen Sie zu sitepoint_django/settings.py, scrollen Sie nach unten und finden Sie die STATIC_URL Einstellung. Darunter fügen Sie die STATIC_ROOT Einstellung hinzu:

# sitepoint_django/settings.py

STATIC_ROOT = BASEDIR / "staticfiles"

Die obige Einstellung teilt Django mit, dass bei Ausführung von collectstatic alle statischen Assets in allen Apps Ihres Projekts in diesem Verzeichnis namens staticfiles gesammelt und gespeichert werden.

Als nächstes müssen Sie den collectstatic Verwaltungsbefehl ausführen:

python manage.py collectstatic

Um WhiteNoise zu aktivieren, müssen Sie es der MIDDLEWARE Einstellungsliste hinzufügen. Bearbeiten Sie die settings.py Datei und fügen Sie das WhiteNoise-Middleware nach dem Django SecurityMiddleware und vor allen anderen Middleware hinzu:

# sitepoint_django/settings.py

MIDDLEWARE = [
    # ...
    "django.middleware.security.SecurityMiddleware",
    "whitenoise.middleware.WhiteNoiseMiddleware",
    # ...
]

Verwenden von WhiteNoise in der Entwicklung

Mit nur den obigen Schritten kann WhiteNoise Ihnen in der Produktion statische Dateien dienen. Wenn Sie das Projekt jedoch zu diesem Zeitpunkt ausführen, wird der Django-Entwicklungsserver automatisch die Verantwortung für die Verarbeitung von statischen Dateien übernehmen. Um jedoch ähnliches Verhalten sowohl in der Entwicklung als auch in der Produktion zu nutzen, ist es eine gute Idee, es auch in der Entwicklung zum Bereitstellen von Dateien zu verwenden.

Um das zu tun, werden wir die Verarbeitung von statischen Dateien in Django deaktivieren und WhiteNoise die Kontrolle übernehmen lassen, indem wir einfach die Einstellungsdatei bearbeiten und WhiteNoise in die INSTALLED_APPS-Liste einfügen, wobei es über der django.contrib.staticfiles gesetzt wird:

# sitepoint_django/settings.py

INSTALLED_APPS = [
    # ...
    "whitenoise.runserver_nostatic",
    "django.contrib.staticfiles",
    # ...
]

Du musst auch DEBUG deaktivieren, indem du es auf False setzt:

# sitepoint_django/settings.py

DEBUG=False

Mit diesen Schritten kannst du deine statischen Assets nahtlos mit dem WhiteNoise-Paket veröffentlichen.

Um zu überprüfen, ob WhiteNoise tatsächlich deine Dateien veröffentlicht, kannst du die django.contrib.staticfiles-Option aus der INSTALLED_APPS-Einstellungsliste entfernen oder auskommentieren. Es ist jedoch wichtig zu beachten, dass das Entfernen von django.contrib.staticfiles einige Befehle zur Verwaltung von statischen Dateien unbrauchbar macht, wie den collectstatic-Befehl. Dieser Befehl ist für das Sammeln und Zusammenführen von statischen Dateien aus deinen Apps in einem einzigen Verzeichnis zur effizienten Bereitstellung in Produktionsumgebungen unerlässlich.

Erweiterte Konfigurationsoptionen für WhiteNoise

Während die oben genannten Schritte für die meisten Fälle ausreichend sind, bietet WhiteNoise einige zusätzliche Konfigurationsoptionen. Sie können beispielsweise Komprimierung und Cache-Unterstützung für Ihr Projekt hinzufügen. Um dies zu aktivieren, öffnen Sie die Datei sitepoint_django/settings.py und fügen Sie die folgenden Einstellungen hinzu:

# sitepoint_django/settings.py

STORAGES = {
    # ...
    "staticfiles": {
        "BACKEND": "whitenoise.storage.CompressedManifestStaticFilesStorage",
    },
}

Die obige Einstellung stellt sicher, dass WhiteNoise die statischen Dateien komprimiert und einen Hash auf sie anwendet, um einen eindeutigen Namen zu erzeugen, sodass sie sicher zwischengespeichert werden können.

Verwendung von WhiteNoise in Shared-Hosting-Umgebungen

Shared Hosting ist eine Art von Webhosting-Dienst, bei dem mehrere Websites auf einem einzigen physischen Server gehostet werden. In dieser Konfiguration werden Ressourcen wie Festplattenspeicher, Datenübertragungsrate und Rechenleistung unter mehreren Nutzern geteilt, was es zu einer kostengünstigen Option für das Hosting von kleinen bis mittelgroßen Websites macht.

Shared Hosting-Umgebungen werden typischerweise von Hosting-Providern verwaltet, die Serverwartung, Sicherheit und technischen Support übernehmen, sodass Website-Besitzer sich auf das Aufbauen und Verwalten ihrer Websites konzentrieren können, ohne sich um Server-Verwaltungsaufgaben kümmern zu müssen.

Herausforderungen bei der Verwaltung statischer Dateien in Shared Hosting

Während Shared Hosting eine kostengünstige und praktische Hosting-Lösung für viele Websites bietet, hat es auch Einschränkungen im Vergleich zu anderen Hosting-Typen wie Virtual Private Servers (VPS) oder dedizierten Servern. Diese Einschränkungen umfassen Folgendes:

Einschränkungen bei Serverkonfigurationen und -einstellungen, die die Möglichkeit begrenzen, Serversoftware anzupassen oder zusätzliche Tools zu installieren.
Ressourcenbeschränkungen wie Festplattenspeicher spielen ebenfalls eine Rolle, da es möglicherweise Beschränkungen bei der Bandbreite gibt, die zur Bereitstellung dieser Dateien an Besucher verwendet werden kann.
Die Leistung könnte in einer Shared-Hosting-Umgebung ein weiteres Problem darstellen, da die Ressourcen mit anderen Benutzern geteilt werden können und zu langsameren Ladezeiten für statische Dateien führen kann, insbesondere während Zeiten hoher Verkehrsstärke oder Ressourcenverwendung.

Konfiguration zur Verwendung von WhiteNoise

WhiteNoise ist ein Python-Paket, das nahtlos mit Django integriert ist und sich daher ideal für die Bereitstellung von statischen Dateien in Shared-Hosting-Umgebungen eignet. Im Gegensatz zu anderen Softwareinstallationen wie Apache und Nginx, die in bestimmten Hosting-Umgebungen möglicherweise nicht zulässig sind, kann WhiteNoise einfach neben deinen anderen Projektpaketen installiert werden.

Durch die Konfiguration von Django zur Verwendung von WhiteNoise können Sie statische Dateien effizient direkt aus Ihrer Django-Anwendung bereitstellen, ohne zusätzliche Serversoftware zu benötigen. Dies vereinfacht den Einrichtungsprozess und stellt eine breite Kompatibilität mit einer Vielzahl von Hosting-Anbietern sicher.

Die meisten Shared-Hosting-Anbieter bieten ein cPanel, das Ihnen das Durchführen von Serverkonfigurationen und Dateiuploads ermöglicht. Sobald Sie also Ihre Dateien hochgeladen haben, können Sie die folgenden Änderungen am Projekt-settings.py-Datei vornehmen:

# sitepoint_django/settings.py

STATIC_URL='static/'

# Ersetzen Sie username durch Ihren cpanel Benutzernamen
# Verwenden Sie public_html, wenn Sie an Ihrem Hauptdomain wie https://example.com arbeiten
STATIC_ROOT='/home/username/public_html/static'

# ODER 
# Verwenden Sie den Ordner-Namen, wenn Sie an einem Sub-Domain wie https://subdomain.example.com arbeiten
STATIC_ROOT='/home/username/subdomain.mydomain.com/static'

Mit diesen Einstellungen müssen Sie nur noch den collectstatic-Befehl ausführen, damit Ihre statischen Dateien in einen der oben genannten STATIC_ROOT-Verzeichnisse gesammelt werden, abhängig vom Domain.

Bereitstellung von statischen Dateien von AWS S3

Amazon Simple Storage Service (S3) ist ein skalierbarer Objektspeicherdienst von Amazon Web Services (AWS). Es ermöglicht Benutzern, Speicherräume, sogenannte Buckets, zu erstellen, in denen Sie verschiedene Arten von Daten wie Dokumente, Bilder, Videos und für unseren Tutorial-relevanten statische Dateien speichern können.

AWS bietet ein kostenloses Tarifangebot für mehrere seiner Dienste, einschließlich Amazon S3. Der kostenlose Tarif ermöglicht es Nutzern, mit AWS-Diensten ohne Kosten für eine bestimmte Zeit oder bis zu spezifischen Nutzungsgrenzen zu beginnen. Um loszulegen, können Sie sich für den kostenlosen S3-Tarif anmelden. Um jedoch den Anmeldevorgang abzuschließen, müssen Sie Zahlungsinformationen bereitstellen.

Erstellen eines S3-Buckets

Um einen Bucket zu erstellen, gehen Sie zum S3-Dashboard und klicken Sie auf die Schaltfläche Bucket erstellen.

Geben Sie dem Bucket einen eindeutigen, dns-konformen Namen. Sie können optional eine Region auswählen, die näher bei Ihnen oder Ihren Benutzern liegt.

Aktivieren Sie ACL für den Bucket.

Aktivieren Sie den öffentlichen Zugriff für den Bucket, indem Sie Alle öffentlichen Zugriffe blockieren ausschalten.

Nach erfolgreicher Erstellung sollten Sie Ihren Bucket auf der Hauptseite von S3 sehen.

Aktivieren des IAM-Zugriffs

Nach der Erstellung eines Buckets können Sie den Bucket als Root-Benutzer verwenden, aber AWS empfiehlt die Erstellung einer IAM (Identity Access Management) Benutzergruppe und die Zuweisung von Zugriff nur auf einen bestimmten Bucket.

Erstellen einer IAM-Gruppe

Gehen Sie zur Hauptseite von IAM und wählen Sie Benutzergruppen im Seitenleistenmenü. Klicken Sie dann auf die Schaltfläche Gruppe erstellen. Weisen Sie der Gruppe einen Namen zu.

Dann unter Anhängen von Berechtigungspolicys, suchen Sie nach S3 und weisen Sie AmazonS3FullAccess zu, klicken Sie dann auf die Schaltfläche Gruppe erstellen.

Erstellen eines IAM-Benutzers

Solange Sie sich noch auf der IAM-Seite befinden, wählen Sie im linken Bereich Benutzer aus und klicken Sie dann auf die Schaltfläche Benutzer erstellen.

Geben Sie dem IAM-Benutzer einen Namen und klicken Sie auf die Schaltfläche Weiter.

Unter der Option Berechtigungen festlegen lassen Sie die Option Benutzer zum Gruppe hinzufügen ausgewählt und gehen dann zu Benutzergruppen und wählen die zuvor erstellte Benutzergruppe aus, bevor Sie auf die Schaltfläche Weiter klicken.

Überprüfen Sie alles und klicken Sie auf Benutzer erstellen.

Klicken Sie nun auf den Benutzernamen, um die Benutzerdetails anzuzeigen. Klicken Sie auf die Registerkarte Sicherheitszertifikate und dann auf Zugriffsschlüssel erstellen. Wählen Sie Lokaler Code und klicken Sie auf die Schaltfläche Weiter.

Danach klicken Sie auf die Schaltfläche Zugriffsschlüssel erstellen. Sie können die Schlüssel in Ihrer .env-Datei kopieren, falls vorhanden, oder die CSV-Datei herunterladen für späteres Gebrauch.

Konfiguration von Django zur Nutzung von AWS S3 für statische Dateien

Nachdem Sie den S3-Bucket erstellt haben, müssen wir das Projekt so konfigurieren, dass Dateien von S3 bereitgestellt werden. Im vorherigen Abschnitt haben wir WhiteNoise zur Bereitstellung unserer statischen Ressourcen konfiguriert. Wir müssen WhiteNoise deaktivieren, damit wir die Ressourcen von S3 bereitstellen können. Gehen Sie dazu zum sitepoint_django/settings.py-Datei und kommentieren Sie die entsprechenden Codezeilen aus:

# sitepoint_django/settings.py

INSTALLED_APPS = [
    # ...
    # "whitenoise.runserver_nostatic",
    # ...
]

MIDDLEWARE = [
    # ...
    # "whitenoise.middleware.WhiteNoiseMiddleware",
    # ...
]

# STORAGES = {
#     "staticfiles": {
#         "BACKEND": "whitenoise.storage.CompressedManifestStaticFilesStorage",
#     },
# }

Der obige Code kommentiert alle Einstellungen aus, die wir für WhiteNoise vorgenommen hatten.

Paketinstallation

Damit das Projekt mit S3 arbeiten kann, müssen wir zwei Pakete installieren: boto3 und django-storages. boto3 stellt die niedrigebene Python-API für die Interaktion mit AWS-Diensten bereit, während django-storages die Dateispeicherungsfähigkeiten von Django erweitert und mit Cloud-Speicheranbietern wie Amazon S3 integriert, sodass Sie die statischen und Medien-Dateien in Ihrer Django-Anwendung nahtlos verwalten und bereitstellen können:

pip install boto3 django-storages

Einstellungen konfigurieren

Damit unser Projekt Dateien von S3 bereitstellen kann, müssen wir einige Änderungen am settings.py-Datei vornehmen und sie mit dem folgenden Code aktualisieren:

# sitepoint_django/settings.py
import os  # zuerst fügen Sie eine Importanweisung für das os-Modul hinzu

# S3-Speicher-Einstellung
STORAGES = {
    'staticfiles': {
        'BACKEND': 'storages.backends.s3boto3.S3Boto3Storage',
        'OPTIONS': {
            'bucket_name': os.getenv('AWS_STORAGE_BUCKET_NAME'),
            'location': 'static',
            'querystring_auth': False,
        },
    }
}

Die obigen Einstellungen erstellen ein STORAGES-Dictionary, das als zentraler Konfigurationscontainer dient und verschiedene Speicher-Backends innerhalb des Projekts definiert.

Es ist wichtig zu beachten, dass diese Einstellung nur für Django-Versionen ab 4.2 und höher verfügbar ist. Für frühere Versionen besuchen Sie bitte die Dokumentation.

Im obigen Code haben wir eine Einstellung für staticfiles, die die Speicherkonfiguration zur Verwaltung von statischen Dateien identifiziert.

Nach den STORAGES-Einstellungen müssen wir in unserer Einstellungsdatei einige AWS-spezifische Einstellungen hinzufügen, also scrollen Sie zu dem Abschnitt, in dem Sie die STATIC_URL-Einstellung finden, und ändern Sie diese wie folgt:

# sitepoint_django/settings.py

USE_S3 = os.getenv('USE_S3')

if USE_S3:
    AWS_ACCESS_KEY_ID = os.getenv('AWS_ACCESS_KEY_ID')
    AWS_SECRET_ACCESS_KEY = os.getenv('AWS_SECRET_ACCESS_KEY')
    AWS_S3_OBJECT_PARAMETERS = {
        "CacheControl": "max-age=2592000",
    }

else:
    STATIC_URL = 'static/'
    STATIC_ROOT = BASE_DIR / 'staticfiles'

Hochladen von statischen Dateien auf S3

Sobald die Einstellungen eingerichtet sind, ist die nächste Aufgabe das Hochladen Ihrer statischen Dateien in den S3-Bucket. Sie tun dies, indem Sie collectstatic ausführen:

python manage.py collectstatic  --no-input

Dies sammelt alle statischen Dateien in den Apps unseres Projekts, verschiebt sie in den S3-Bucket und legt sie in einem static-Ordner ab, wie in dem STORAGES-Dictionary definiert. Das Fehlen des --no-input-Flags instruiert Django, im nicht-interaktiven Modus zu laufen und jegliche Aufforderungen zur Benutzereingabe zu überspringen.

Bei der Verwendung von Django führt das System automatisch den Prozess der Sammlung von statischen Dateien durch, ohne dass vom Benutzer eine manuelle Intervention erforderlich ist.

Projekt ausführen

Nachdem alle Einstellungen vorgenommen wurden, können Sie das Projekt starten. Lassen Sie uns das Projekt im Entwicklungsmodus ausführen und die Dateien aus dem S3-Bucket bereitstellen:

python manage.py runserver

Um zu überprüfen, ob Sie tatsächlich Dateien von S3 bereitstellen, können Sie den Quellcode der Startseite ansehen:

<link rel="stylesheet" href="https://sitepoint-django-static.s3.amazonaws.com/static/static_demo/css/styles.css">

<img src="https://sitepoint-django-static.s3.amazonaws.com/static/static_demo/images/flowerImage.png" alt="Flower Image">

<script src="https://sitepoint-django-static.s3.amazonaws.com/static/static_demo/js/todays_date.js"></script>

Beim Betrachten der HTML-Elemente wird deutlich, dass die URLs tatsächlich auf den S3-Bucket verweisen.

Zusammenfassung

Zusammenfassend besteht die Verwaltung von statischen Dateien in Django darin, die Projektanforderungen, Skalierungsbedürfnisse und Hostingumgebungsbeschränkungen abzuwägen, um die geeignetste Methode auszuwählen.

Zum Beispiel bietet das WhiteNoise-Middleware eine effiziente Lösung für die Bereitstellung von statischen Dateien in Shared-Hosting-Umgebungen, in denen Ressourcenbeschränkungen und begrenzter Serverzugriff Herausforderungen darstellen können.

Durch die entsprechende Konfiguration der Django-Einstellungen und die Nutzung von Werkzeugen wie WhiteNoise können Entwickler die zuverlässige und optimierte Bereitstellung von statischen Dateien gewährleisten, unabhängig von der Hostingumgebung. Jede Methode bietet ihre eigenen Vorteile und Überlegungen, die sorgfältig bewertet werden müssen, um die spezifischen Bedürfnisse des Projekts zu erfüllen und eine reibungslose Benutzerfreundlichkeit zu gewährleisten.

Wir haben mehrere wichtige Punkte behandelt:

Methoden zur Verwaltung von statischen Dateien. Wir haben verschiedene Ansätze diskutiert, einschließlich des lokalen Servierens von statischen Dateien, Verwendung des integrierten Entwicklungsservers von Django, Nutzung von Drittanbieterspeichersystemen wie Amazon S3 und Servieren von Dateien mithilfe von Paketen wie WhiteNoise. Jede Methode hat ihre eigenen Vorteile und Überlegungen, abhängig von Faktoren wie Skalierbarkeit, Leistung und Einfachheit der Bereitstellung.

Allgemeine Einstellungen und Befehle:

STATIC_ROOT: legt das Verzeichnis fest, in dem gesammelte statische Dateien gespeichert werden.
STATIC_URL: definiert die Basis-URL zum Abrufen von statischen Dateien über den Webserver.
STATICFILES_DIRS: spezifiziert zusätzliche Verzeichnisse, die statische Assets enthalten.
STATICFILES_STORAGE: konfiguriert den Speicherbackend zur Verarbeitung von statischen Dateien.
collectstatic: sammelt alle statischen Assets aus allen App-Verzeichnissen zum STATIC_ROOT.

Weiterführende Lektüre: