Detaillierte Erläuterung von Django + Vue + Docker zum Erstellen einer Schnittstellentestplattform

1. Zwei Wörter am Anfang

Hallo zusammen, mein Name ist Lin Zonglin. Ich bin Testingenieur und Teilnehmer im Full-Stack-Testing-Trainingscamp.

Nach Abschluss der Kursreihe zur Docker -Containertechnologie im Trainingslager ist es selbstverständlich, sich im praktischen Einsatz damit vertraut zu machen. Die Testplattform für die Schnittstellenautomatisierung musste zufällig auf einen neuen Testserver migriert werden, deshalb wollte ich Docker -Funktion „Einmal erstellen, überall ausführen“ ausprobieren. Dieser Artikel stellt kurz den Bereitstellungsprozess vor, der benutzerdefinierte Dockerfile -Images und Docker-Compose -Multicontainer-Orchestrierung verwendet.

2. Projekteinführung

Das Projekt wird mithilfe einer Technologie zur Trennung von Front-End und Back-End implementiert. Das Front-End ist Vue+ElementUI , das Back-End ist Django+DRF , die Datenbank ist MySQL und die aktuell bereitgestellte Version hat keine andere Middleware.

2.1 Installieren Sie Docker und Docker-Compose

Alle folgenden Vorgänge werden in Centos 7 Umgebung ausgeführt

1. Alte Versionen bereinigen oder deinstallieren:

sudo yum entferne Docker \
                  Docker-Client \
                  docker-client-neueste \
                  docker-allgemein \
                  docker-neueste \
                  docker-latest-logrotate \
                  docker-logrotate \
                  Docker-Engine

2. Aktualisieren Sie die Yum-Bibliothek

sudo yum install -y yum-utils
sudo yum-config-manager \
    --add-repo \
    https://download.docker.com/linux/centos/docker-ce.repo

3. Installieren Sie die neueste Version

sudo yum installiere docker-ce docker-ce-cli containerd.io

4. Starten Sie den Docker-Dienst

sudo systemctl starte Docker

5. Laden Sie das Docker Compose-Installationspaket herunter

Der Vorteil der Verwendung von curl zur Installation besteht darin, dass Sie sich keine Sorgen machen müssen, dass einige Abhängigkeiten fehlen.

sudo curl -L "https://github.com/docker/compose/releases/download/1.28.6/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose

6. Ändern Sie die Berechtigungen von Docker Compose

sudo chmod +x /usr/local/bin/docker-compose

2.2 Dockerfile benutzerdefinierter Python-Container

Legen Sie zunächst den zu implementierenden Django-Projektcode in einem bestimmten Verzeichnis ab (hier ist /data/test_object ).

Legen Sie die Django-Projektabhängigkeitspaketdatei requirements.txt in dieses Verzeichnis

Erstellen Sie eine Dockerfile-Datei: vim Dockerfile

Inhalt der Docker-Datei: (Hinweis: Fügen Sie nach Anweisungen keine Kommentare ein, da dies bei der Ausführung einiger Anweisungen zu Problemen führen kann):

# Basisbild VON python:3.6.8

# Leiten Sie die Ausgabe rechtzeitig in die Datei um und ersetzen Sie python -u
ENV PYTHONUNBUFFERED 1

# Erstellen Sie ein Verzeichnis und wechseln Sie das Arbeitsverzeichnis RUN mkdir /code && mkdir /code/db
ARBEITSVERZEICHNIS /code

# Datei hinzufügen ADD ./requirements.txt /code/

# Führen Sie den Befehl RUN pip install -r requirements.txt aus

# Datei hinzufügen ADD ./code/

2.3 Docker Compose-Container schreiben

Ordnen Sie dasselbe Verzeichnis an und erstellen Sie eine Datei docker-compose.yml: vim docker-compose.yml , content (Python-Container und Mysql-Container orchestrieren)

# Docker-Compose-Version: „3.9“

# Service-Informationsdienste:

  # MySQL-Container, benutzerdefinierter Name db:
    Bild:mysql:5.7
    exponieren:
      - "3306"
    Bände:
      - ./db:/var/lib/mysql
    #Setzen Sie den Datensatz der Datenbanktabelle Befehl: [
      „--character-set-server=utf8“,
      „--collation-server=utf8_unicode_ci“
      ]
    Umfeld:
      -MYSQL_DATABASE=xxxx
      -MYSQL_ROOT_PASSWORD=yyyy
    Neustart: immer


  # Django bedient das Web:
    # Erstellen Sie einen Python-Container basierend auf der Docker-Datei in diesem Pfad build: .
    Befehl: bash -c "python ./test_plat_form/manage.py migrieren und python ./test_plat_form/manage.py runserver 0.0.0.0:8000"
    Bände:
      - .:/Code
    Häfen:
      - "8000:8000"
    exponieren:
      - "8000"
    # Der Dienst, von dem der aktuelle Dienst abhängt, startet zuerst den abhängigen Dienst und dann den aktuellen Dienst, der von ihm abhängt:
      -db
    # Die Container-IP ist variabel und ersetzt den HOST-Wert von MySQL in der Konfigurationsdatei. Der Name muss mit dem Namen des oben verlinkten MySQL-Containerdienstes übereinstimmen:
      -db
    Bände:
      - ./Dateien/Suiten:/Code/Testplattform/Suiten
      - ./files/debugs:/code/test_plat_form/debugs
      - ./files/reoprts:/code/test_plat_form/reports
      - ./files/run_log:/code/test_plat_form/run_log

Ändern Sie den MySQL-Host in der Datei setting.py des Django-Projekts auf den Wert von links im obigen Webknoten

DATENBANKEN = {
    'Standard': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'xxxx',
        'BENUTZER': 'root',
        'PASSWORT': 'yyyy',
        'HOST': 'db', # Hier ändern 'PORT': 3306
    }
}

Befehl ausführen

Pfad: docker-compose build build
Führen Sie den Container aus: docker-compose up oder führen Sie den Container im Hintergrund aus: docker-compose up -d

2.4 Vue-Projektaufbau

Vue kann mit der herkömmlichen Methode erstellt werden:

Serverkonfigurationsknoten-NPM-Umgebung

Installieren Sie global pm2

Ändern Sie den Host der API im Projekt in die IP oder den Domänennamen des Servers

Verpacken Sie das Vue-Projekt: npm run build Schreiben Sie ein app.js Startskript, dessen Hauptzweck darin besteht, die Einzelseitendatei (index.js) im Verzeichnis „dist“ zu lesen und auf Port 8080 zu lauschen.

const fs = erfordern('fs');
const path = require('Pfad');
const express = erfordern('express');
const app = express();

app.use(express.static(Pfad.auflösen(__dirname, './dist')))
//Lesen Sie die Einzelseitendatei (index.js) im Verzeichnis und lauschen Sie auf Port 8080.
app.get('*', Funktion(erfordert, res) {
    const html = fs.readFileSync(Pfad.resolve(__dirname, './dist/index.html'), 'utf-8')
    res.senden(html)
})

app.listen(8080);

Kopieren Sie das gepackte dist-Verzeichnis, app.js und package.json in das Projektverzeichnis

Rufen Sie das Projektverzeichnis auf und installieren Sie Abhängigkeiten: npm install install

Starten Sie den Dienst: pm2 start app.js 5. Endgültiger Effekt

Containerprotokolle ausführen:

Rufen Sie über den Browser die Adresse http://ip:8080 auf und melden Sie sich an:

Abschluss

Die Zusammensetzung dieses Projekts ist derzeit relativ einfach und es werden nur zwei Container zur Orchestrierung verwendet. Aber wenn wir dies als Beispiel nehmen: Wenn wir mehrere Container erstellen, passen wir zunächst verschiedene Container entsprechend der Projektzusammensetzung an und planen dann die Organisationsbeziehungen und Abhängigkeitsbeziehungen zwischen den Containern. Ich glaube, dass sie reibungslos erstellt werden können.

Dies ist das Ende dieses Artikels über die praktische Anwendung von Django+Vue+Docker zum Erstellen einer Plattform zum Testen von Schnittstellen. Weitere relevante Inhalte zum Testen von Django+Vue+Docker-Schnittstellen finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!