Anzeigen von Daten aus der DigitalOcean-API mit Django

Der Autor hat die Mozilla Foundation dazu ausgewählt, im Rahmen des Programms Write for DOnations eine Spende zu erhalten.

Einführung

Da der Bedarf nach einer Full-Stack-Entwicklung weiter wächst, sorgen Web-Frameworks für Entwicklungsabläufe, die einfacher und effizienter sind; Django ist eines dieser Frameworks. Django kommt bei bekannten Websites wie Mozilla, Pinterest und Instagram zum Einsatz. Im Gegensatz zu Flask, das ein neutrales Mikro-Framework ist, enthält das Django PyPI-Paket alles, was Sie zur Full-Stack-Entwicklung benötigen; eine Datenbank oder Kontrolltafel für die Entwicklung muss nicht eingerichtet werden.

Ein verbreitetes Anwendungsbeispiel für Django besteht in der Anzeige von Informationen aus APIs (wie Instagram-Posts oder GitHub-Repositorys) in Ihren eigenen Websites und Web-Apps. Zwar ist dies auch mit anderen Frameworks möglich, doch bedeutet das Motto “Batterien inbegriffen” von Django, dass der Aufwand geringer ist und weniger Pakete benötigt werden, um dasselbe Ergebnis zu erzielen.

In diesem Tutorial erstellen Sie ein Django-Projekt, das die Droplet-Informationen Ihres DigitalOcean-Kontos mit der DigitalOcean v2 API anzeigt. Genauer gesagt werden Sie eine Website erstellen, die eine Tabelle mit Droplets anzeigt, in der ihre jeweiligen IP-Adressen, IDs, Hosting-Regionen und Ressourcen aufgeführt werden. Ihre Website wird BulmaCSS verwenden, um die Seite so zu gestalten, dass Sie sich auf die Entwicklung konzentrieren können und die Seite am Ende trotzdem gut aussieht.

Nach Abschluss dieses Tutorials werden Sie über ein Django-Projekt verfügen, das eine Webseite erstellen kann, die wie folgt aussieht:

Voraussetzungen

Bevor Sie diese Anleitung beginnen, benötigen Sie Folgendes:

• Ein DigitalOcean-Konto mit mindestens einem Droplet und einem persönlichen Zugriffstoken. Stellen Sie sicher, dass Sie das Token an einem sicheren Ort aufbewahren; Sie werden es später in dem Tutorial noch benötigen.
• Vertrautheit mit dem Richten von Anfragen an APIs. Ein umfassendes Tutorial zur Arbeit mit APIs finden Sie unter Verwenden von Web-APIs in Python3.
• Eine lokale virtuelle Umgebung für Python zur Aufrechterhaltung von Abhängigkeiten. In diesem Tutorial verwenden wir den Namen do_django_api für unser Projektverzeichnis und env für unsere virtuelle Umgebung.
• Vertrautheit mit der Vorlagenlogik von Django beim Rendern von Seiten mit API-Daten.
• Vertrautheit mit der Anzeigelogik von Django bei der Handhabung von Daten, die von der API empfangen werden, und Übergabe an eine Vorlage für das Rendering.

Schritt 1 — Einrichten eines einfachen Django-Projekts

Installieren Sie Django aus der virtuellen Umgebung env heraus:

pip install Django

Jetzt können Sie ein Django-Projekt starten und einige anfängliche Einrichtungsbefehle ausführen.

Verwenden Sie django-admin startproject <name>, um im Projektordner, der den Namen Ihres Django-Projekts trägt, ein Unterverzeichnis zu erstellen; wechseln Sie anschließend in dieses Verzeichnis.

django-admin startproject do_django_project
cd do_django_project

Nach der Erstellung finden Sie in diesem Unterverzeichnis manage.py; das ist die übliche Methode, um mit Django zu interagieren und Ihr Projekt auszuführen. Verwenden Sie migrate, um die Entwicklungsdatenbank von Django zu aktualisieren:

python3 manage.py migrate

Sie werden eine Ausgabe sehen, die folgendermaßen aussieht, während die Datenbank aktualisiert wird:

Output
Operations to perform:
  Apply all migrations: admin, auth, contenttypes, sessions
Running migrations:
  Applying contenttypes.0001_initial... OK
  Applying auth.0001_initial... OK
  Applying admin.0001_initial... OK
  Applying admin.0002_logentry_remove_auto_add... OK
  Applying admin.0003_logentry_add_action_flag_choices... OK
  Applying contenttypes.0002_remove_content_type_name... OK
  Applying auth.0002_alter_permission_name_max_length... OK
  Applying auth.0003_alter_user_email_max_length... OK
  Applying auth.0004_alter_user_username_opts... OK
  Applying auth.0005_alter_user_last_login_null... OK
  Applying auth.0006_require_contenttypes_0002... OK
  Applying auth.0007_alter_validators_add_error_messages... OK
  Applying auth.0008_alter_user_username_max_length... OK
  Applying auth.0009_alter_user_last_name_max_length... OK
  Applying auth.0010_alter_group_name_max_length... OK
  Applying auth.0011_update_proxy_permissions... OK
  Applying sessions.0001_initial... OK

Verwenden Sie als Nächstes den Befehl runserver, um das Projekt auszuführen, damit Sie es testen können:

python3 manage.py runserver

Die Ausgabe sieht wie folgt aus, während der Server gestartet wird:

Output
Watching for file changes with StatReloader
Performing system checks...

System check identified no issues (0 silenced).
September 22, 2019 - 22:57:07
Django version 2.2.5, using settings 'do_django_project.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.

Sie verfügen nun über ein einfaches Django-Projekt und einen Entwicklungsserver, der ausgeführt wird. Um Ihren ausgeführten Entwicklungsserver anzuzeigen, rufen Sie in einem Browser 127.0.0.1:8000 auf. Damit wird die Startseite von Django angezeigt:

Als Nächstes erstellen Sie eine Django-App und konfigurieren Ihr Projekt, um eine Ansicht von dieser App auszuführen, damit Sie etwas Aufregenderes als die Standardseite sehen.

Schritt 2 — Einrichten einer einfachen Django-App

In diesem Schritt schaffen Sie das Fundament für die App, die Ihre Droplet-Ergebnisse enthalten wird. Sie werden später wieder zu dieser App zurückkehren, sobald Sie den API-Aufruf eingerichtet haben, um die App mit Daten zu füllen.

Stellen Sie sicher, dass Sie sich im Verzeichnis do_django_project befinden, und erstellen Sie mit dem folgenden Befehl eine Django-App:

python3 manage.py startapp display_droplets

Jetzt müssen Sie die neue App INSTALLED_APPS in der Datei settings.py hinzufügen, damit Django sie erkennen kann. settings.py ist eine Django-Konfigurationsdatei, die sich im Django-Projekt in einem anderen Unterverzeichnis befindet und den gleichen Namen trägt wie der Projektordner (do_django_project). Django hat beide Ordner für Sie erstellt. Wechseln Sie zum Verzeichnis do_django_project:

cd do_django_project

Bearbeiten Sie settings.py in einem Editor Ihrer Wahl:

nano settings.py

Fügen Sie Ihre neue App dem Abschnitt INSTALLED_APPS der Datei hinzu:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    # The new app
    'display_droplets',
]

Speichern und schließen Sie die Datei, wenn Sie fertig sind.

Anzeigefunktion GetDroplets

Als Nächstes erstellen Sie eine Funktion namens GetDroplets in der Datei views.py der App display_droplets. Diese Funktion rendert die Vorlage,die Sie zur Anzeige von Droplet-Daten verwenden werden, als context von der API. context ist ein Wörterbuch, das es erlaubt, Daten aus Python-Code zu übernehmen und an eine HTML-Vorlage zu senden, damit sie sich in einer Webseite anzeigen lassen.

Wechseln Sie zum Verzeichnis display_droplets:

cd ..
cd display_droplets

Öffnen Sie views.py, um die Datei zu bearbeiten:

nano views.py

Fügen Sie den folgenden Code zur Datei hinzu:

from django.views.generic import TemplateView

class GetDroplets(TemplateView):
    template_name = 'droplets.html'
    def get_context_data(self, *args, **kwargs):
        pass

Speichern und schließen Sie die Datei.

Später werden Sie diese Funktion ausfüllen und die Datei droplets.html erstellen. Zuerst konfigurieren wir aber urls.py, um diese Funktion anzurufen, wenn Sie das Stammverzeichnis des Entwicklungsservers (127.0.0.1:8000) aufrufen.

Wechseln Sie wieder zum Verzeichnis do_django_project:

cd ..
cd do_django_project

Öffnen Sie urls.py, um die Datei zu bearbeiten:

nano urls.py

Fügen Sie eine import-Anweisung für GetDroplets und dann einen zusätzlichen Pfad zu urlpatterns hinzu, der auf die neue Ansicht verweist.

from django.contrib import admin
from django.urls import path
from display_droplets.views import GetDroplets

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', GetDroplets.as_view(template_name='droplets.html'), name='Droplet View'),
]

Wenn Sie Ihre eigenen Pfade einrichten möchten, ist der erste Parameter die URL (wie z. B. example.com/**admin**), der zweite Parameter die Funktion, die zum Erstellen der Webseite aufgerufen wird, und der dritte nur ein Name für den Pfad.

Speichern und schließen Sie die Datei.

Droplets-Vorlage

Als Nächstes arbeiten Sie mit Vorlagen. Vorlagen sind HTML-Dateien, die Django zur Erstellung von Webseiten verwendet. In diesem Fall verwenden Sie eine Vorlage, um eine HTML-Seite zu erstellen, die die API-Daten anzeigt.

Wechseln Sie wieder zum Verzeichnis display_droplets:

cd ..
cd display_droplets

Erstellen Sie in diesem Verzeichnis einen Ordner template und wechseln Sie in dieses Verzeichnis:

mkdir templates
cd templates

Erstellen Sie droplets.html und öffnen Sie die Datei, um sie zu bearbeiten:

nano droplets.html

Um kein CSS für dieses Projekt schreiben zu müssen, verwenden wir Bulma CSS, da es sich dabei um ein kostenloses und schlankes CSS-Framework für die Erstellung von übersichtlichen Webseiten handelt. Sie müssen der HTML lediglich einige Klassenattribute hinzufügen.

Jetzt erstellen wir eine Vorlage mit einer einfachen Navigationsleiste. Fügen Sie der Datei droplets.html den folgenden Code hinzu:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>DigitalOcean Droplets</title>
    <link crossorigin="anonymous"
          href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.min.css"
          integrity="sha256-8B1OaG0zT7uYA572S2xOxWACq9NXYPQ+U5kHPV1bJN4="
          rel="stylesheet"/>
    <link rel="shortcut icon" type="image/png" href="https://assets.digitalocean.com/logos/favicon.png"/>
</head>
<body>
<nav aria-label="main navigation" class="navbar is-light" role="navigation">
    <div class="navbar-brand">
        <div class="navbar-item">
            <img atl="DigitalOcean" src="https://assets.digitalocean.com/logos/DO_Logo_icon_blue.png"
                 style="margin-right: 0.5em;">Droplets
        </div>
    </div>
</nav>
</body>
</html>

Speichern und schließen Sie die Datei.

Dieser Code sorgt dafür, dass Bulma in den HTML-Baustein importiert und eine nav-Leiste zur Anzeige von “Droplets” erstellt wird.

Aktualisieren Sie Ihren Browser-Tab, um die Änderungen, die Sie an der Vorlage vorgenommen haben, anzuzeigen.

Bisher haben Sie noch keine APIs verwendet; Sie haben vielmehr ein Fundament für das Projekt geschaffen. Als Nächstes nutzen Sie diese Seite sinnvoll, indem Sie einen API-Aufruf einrichten und die Droplet-Daten bereitstellen.

Schritt 3 — Einrichten des API-Aufrufs

In diesem Schritt richten Sie einen API-Aufruf ein und senden die Droplet-Daten als Kontext an die Vorlage, um in einer Tabelle angezeigt zu werden.

Abrufen von Droplet-Daten

Navigieren Sie zurück zum App-Verzeichnis display_droplets:

cd ..

Installieren Sie die Bibliothek requests, damit Sie mit der API kommunizieren können:

pip install requests

Mithilfe der Bibliothek requests kann Ihr Code Daten von APIs anfordern und Kopfzeilen hinzufügen (zusätzliche Daten, die mit unserer Anfrage gesendet werden).

Als Nächstes erstellen Sie eine Datei services.py, über die Sie den API-Aufruf vornehmen. Diese Funktion verwendet requests, um mit https://api.digitalocean.com/v2/droplets zu kommunizieren und jedes Droplet in der JSON-Datei anzufügen, das an eine Liste zurückgegeben wird.

Öffnen Sie services.py, um die Datei zu bearbeiten:

nano services.py

Fügen Sie den folgenden Code zur Datei hinzu:

import os
import requests

def get_droplets():
    url = 'https://api.digitalocean.com/v2/droplets'
    r = requests.get(url, headers={'Authorization':'Bearer %s' % 'access_token'})
    droplets = r.json()
    droplet_list = []
    for i in range(len(droplets['droplets'])):
        droplet_list.append(droplets['droplets'][i])
    return droplet_list

Innerhalb der Funktion get_droplets passieren zwei Dinge: Es wird eine Anfrage vorgenommen und Daten werden analysiert. url enthält die URL, die Droplet-Daten von der DigitalOcean-API anfordert. r speichert die angeforderten Daten.

requests übernimmt in diesem Fall zwei Parameter: url und headers. Wenn Sie Daten von einer anderen API nutzen möchten, ersetzen Sie den Wert url durch die entsprechende URL. headers sendet DigitalOcean Ihr Zugriffstoken, damit das Unternehmen weiß, dass Sie die Anfrage vornehmen dürfen und für welches Konto die Anfrage vorgenommen wird.

droplets enthält die Informationen aus der Variable r, wurde nun jedoch von JSON, dem Format, in dem die API Informationen sendet, in ein Wörterbuch konvertiert, das bequem in einer for-Schleife zu verwenden ist.

Die nächsten drei Zeilen erstellen ein Array namens droplet_list[]. Dann iteriert eine for-Schleife über die Informationen in droplets und fügt jedes Element der Liste hinzu. Alle von der API übernommenen und in droplets gespeicherten Informationen finden Sie in der Entwicklerdokumentation von DigitalOcean.

Speichern und schließen Sie die Datei.

Schutz Ihres Zugriffstokens

Sie sollten Ihr Zugriffstoken stets verstecken. Wenn aber auch andere Personen das Projekt ausführen dürfen, sollten Sie ihnen eine einfache Möglichkeit bieten, um eigene Zugriffstoken hinzuzufügen, ohne dass Python-Code bearbeitet werden muss. DotENV ist die Lösung, wenn Variablen in einer .env-Datei aufbewahrt werden, die bequem bearbeitet werden kann.

Wechseln Sie wieder zum Verzeichnis do_django_project:

cd ..

Um mit Umgebungsvariablen zu arbeiten, installieren Sie python-dotenv:

pip install python-dotenv

Nach der Installation müssen Sie Django für den Umgang mit Umgebungsvariablen konfigurieren, damit Sie in Code auf sie verweisen können. Dazu müssen Sie einige Codezeilen zu manage.py und wsgi.py hinzufügen.

Öffnen Sie manage.py, um die Datei zu bearbeiten:

nano manage.py

Fügen Sie folgenden Code hinzu:

"""Django's command-line utility for administrative tasks."""
import os
import sys
import dotenv

def main():
    os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'do_django_project.settings')
    try:
        from django.core.management import execute_from_command_line
    except ImportError as exc:
        raise ImportError(
            "Couldn't import Django. Are you sure it's installed and "
            "available on your PYTHONPATH environment variable? Did you "
            "forget to activate a virtual environment?"
        ) from exc
    execute_from_command_line(sys.argv)

if __name__ == '__main__':
    main()

dotenv.load_dotenv(
    os.path.join(os.path.dirname(__file__), '.env')
)

Das Hinzufügen von dem Code in manage.py bedeutet, dass bei der Ausgabe von Befehlen an Django in der Entwicklung Umgebungsvariablen von Ihrer .env-Datei verarbeitet werden.

Speichern und schließen Sie die Datei.

Wenn Sie in Ihren Produktionsprojekten Umgebungsvariablen bearbeiten müssen, können Sie dies mit der Datei wsgi.py tun. Wechseln Sie zum Verzeichnis do_django_project:

cd do_django_project

Öffnen Sie anschließend wsgi.py, um die Datei zu bearbeiten:

nano wsgi.py

Fügen Sie wsgi.py folgenden Code hinzu:

import os
import dotenv

from django.core.wsgi import get_wsgi_application

os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'do_django_project.settings')

dotenv.load_dotenv(
    os.path.join(os.path.dirname(os.path.dirname(__file__)), '.env')
)

application = get_wsgi_application()

Dieser Codeausschnitt weist einen zusätzlichen os.path.dirname() auf, weil wsgi.py zwei Verzeichnisse zurückgehen muss, um die Datei .env zu finden. Dieser Ausschnitt ist nicht identisch mit dem, der für manage.py verwendet wird.

Speichern und schließen Sie die Datei.

Nun können Sie anstelle Ihres Zugriffstokens eine Umgebungsvariable in services.py verwenden. Wechseln Sie wieder zum Verzeichnis display_droplets:

cd ..
cd display_droplets

Öffnen Sie services.py, um die Datei zu bearbeiten:

nano services.py

Ersetzen Sie nun Ihr Zugriffstoken durch eine Umgebungsvariable:

import os
import requests

def get_droplets():
    url = "https://api.digitalocean.com/v2/droplets"
    r = requests.get(url, headers={'Authorization':'Bearer %s' % os.getenv('DO_ACCESS_TOKEN')})
    droplets = r.json()
    droplet_list = []
    for i in range(len(droplets['droplets'])):
        droplet_list.append(droplets['droplets'][i])
    return droplet_list

Speichern und schließen Sie die Datei.

Der nächste Schritt besteht aus der Erstellung einer .env-Datei. Wechseln Sie wieder zum Verzeichnis do_django_project:

cd ..

Erstellen Sie eine .env-Datei und öffnen Sie die Datei, um sie zu bearbeiten:

nano .env

Fügen Sie in .env Ihr Token als Variable DO_ACCESS_TOKEN hinzu:

DO_ACCESS_TOKEN=access_token

Speichern und schließen Sie die Datei.

Die API-Verbindung ist nun eingerichtet und konfiguriert; zudem haben Sie Ihr Zugriffstoken geschützt. Es ist an der Zeit, die Informationen, die Sie für den Benutzer abgerufen haben, bereitzustellen.

Schritt 4 — Umgang mit Droplet-Daten in Ansichten und Vorlagen

Nachdem Sie nun API-Aufrufe vornehmen können, müssen Sie die Droplet-Daten zum Rendern an die Vorlage senden. Kehren wir zum Stub der Funktion GetDroplets zurück, die Sie zuvor in views.py erstellt haben. In der Funktion senden Sie droplet_list als Kontext an die Vorlage droplets.html.

Wechseln Sie zum Verzeichnis display_droplets:

cd display_droplets

Öffnen Sie views.py, um die Datei zu bearbeiten:

nano views.py

Fügen Sie views.py folgenden Code hinzu:

from django.shortcuts import render
from django.views.generic import TemplateView
from .services import get_droplets

class GetDroplets(TemplateView):
    template_name = 'droplets.html'
    def get_context_data(self, *args, **kwargs):
        context = {
            'droplets' : get_droplets(),
        }
        return context

Die an die Vorlage droplets.html gesendeten Informationen werden mit dem Wörterbuch context verwaltet. Aus diesem Grund dient droplets als Schlüssel, während das von get_droplets() zurückgegebene Array als Wert fungiert.

Speichern und schließen Sie die Datei.

Bereitstellen der Daten in der Vorlage

In der Vorlage droplets.html erstellen Sie eine Tabelle und befüllen sie mit den Droplet-Daten.

Wechseln Sie zum Verzeichnis templates:

cd templates

Öffnen Sie droplets.html, um die Datei zu bearbeiten:

nano droplets.html

Fügen Sie nach dem Element nav in droplets.html folgenden Code hinzu:

<table class="table is-fullwidth is-striped is-bordered">
    <thead>
    <tr>
        <th>Name</th>
        <th>IPv4 Address(es)</th>
        <th>Id</th>
        <th>Region</th>
        <th>Memory</th>
        <th>CPUs</th>
        <th>Disk Size</th>
    </tr>
    </thead>
    <tbody>
    {% for droplet in droplets %}
    <tr>
        <th>{{ droplet.name }}</th>
        {% for ip in droplet.networks.v4 %}
        <td>{{ ip.ip_address }}</td>
        {% endfor %}
        <td>{{ droplet.id }}</td>
        <td>{{ droplet.region.name }}</td>
        <td>{{ droplet.memory }}</td>
        <td>{{ droplet.vcpus }}</td>
        <td>{{ droplet.disk }}</td>
    </tr>
    {% endfor %}
    </tbody>
</table>

{% for droplet in droplets %} ... {% endfor %} ist eine Schleife, die durch das Array von Droplets, die aus views.py abgerufen wurden, iteriert. Jedes Droplet wird in eine Tabellenzeile eingefügt. Die verschiedenen {{ droplet.<attribute> }}-Zeilen rufen dieses Attribut für jedes Droplet in der Schleife ab und fügen es in eine Tabellenzelle ein.

Speichern und schließen Sie die Datei.

Aktualisieren Sie Ihren Browser; es wird eine Liste von Droplets angezeigt.

Nun können Sie die DigitalOcean-API in Ihren Django-Projekten verwenden. Sie haben die von der API abgerufenen Daten übernommen und in die zuvor erstellte Vorlage eingespeist, um die Informationen auf lesbare und flexible Weise anzuzeigen.

Zusammenfassung

In diesem Artikel haben Sie ein Django-Projekt erstellt, das Droplet-Daten aus der DigitalOcean-API im Bulma CSS-Stil anzeigen kann. In diesem Tutorial haben Sie drei wichtige Fähigkeiten erlernt:

• Verwalten von API-Anfragen in Python mit den Modulen requests und json.
• Anzeigen von API-Daten in einem Django-Projekt unter Verwendung der Logiken view und template.
• Sicheres Verwalten Ihrer API-Token in Django mit dotenv.

Nachdem Sie eine Einführung in die Handhabung von APIs in Django erhalten haben, können Sie nun ein eigenes Projekt erstellen: entweder mit einer anderen Funktion aus der DigitalOcean-API oder einer ganz anderen API. Zudem können Sie andere Django-Tutorials bzw. ein ähnliches Tutorial mit dem React-Framework konsultieren.