Versuch Flask HTTP #

HTTP ist die Grundlage für das World Wide Web so wie wir es heute kennen. Es basiert hierbei auf TCP und liefert einen Container für Web Content.

HTTP Server mit Python und Flask #

Es existieren zahlreiche Frameworks für HTTP Server Applikationen.

• Apache Webserver mit PHP
• NodeJS mit expressjs
• Python mit Flask oder Django
• Java mit Spring / Springboot
• Ruby mit Ruby on Rails
• golang mit verschienen Frameworks

Flask Webserver #

Das Python Framework Flask erlaubt das erstellen eines Webservers in wenigen Zeilen Code.

1. Installieren Sie die Flask Libraries auf dem Target
   bash

   sudo apt install python3-flask
   

2. Verwenden Sie für diesen Versuch Visual Studio Code und erstellen Sie ein neues File httpd.py.

from flask import Flask

app = Flask(__name__, static_url_path='/static')


@app.route('/')
def index():
    return app.send_static_file("index.html")


@app.route('/main.js')
def js():
    return app.send_static_file("main.js")


if __name__ == "__main__":
    app.run(debug=True, port=12345, host="0.0.0.0")

2. Erstellen Sie einen Ordner static mit einem File index.html und main.js.
3. Beginnen Sie in VS Code mit dem tippen von html im File index.html und wählen Sie mit CTRL + Space die Option html:5. Mit Tab springen Sie durch die Einträge.
4. Setzen Sie einen Titel und fügen Sie dem Body einen <h1> Tag hinzu mit dem Namen Ihrer Seite.
5. In main.js fügen Sie eine Zeile hinzu console.log("hello world!")
6. Binden Sie main.js via script tag ein. Tippen Sie script und verwenden Sie CTRL Space für autocomplete.

Starten Sie den Flask Server mit

python3 httpd.py

HTTP Client #

Webbrowser (Chrome, Firefox, IE, Opera, Safari, etc.) #

1. Starten Sie Chrome und besuchen Sie die Webseite.
2. In Chrome, öffnen Sie debug Console mit F12 und gehen Sie zum Tab Network.
3. Laden Sie die Seite nun mit F5 neu. Was für Requests sehen Sie?
4. Wo finden Sie den output vom Javascript File?

curl - console based http client #

1. Verwenden Sie auf dem Target den curl command um die Webseite aufzurufen.
2. Fügen Sie nun curl die Flags -vvv hinzu. Was sehen Sie zusätzlich?

wget - download web resources #

Auf dem Target könne Sie Webseiten via wget herunterladen (Falls wget nicht vorhanden ist, installieren Sie dieses nach).

Führen Sie wget aus um die erstellte HTML Seite in einem File zu speichern.

Dynamische Informationen #

Mit dem Flask Webserver stehen Ihnen alle Mittel von Python zur Verfügung. Erstellen Sie einen Endpoint, welcher netstat -ntel ausliest und diese Information als Webseite ausgibt.

POST Requests #

Defaultmässig werden im Webbrowser GET Requests ausgeführt. Bei diesen Requests trägt der Body von HTTP keine Daten. Möchten Sie Daten an den Webserver senden, können Sie dies mit POST Requests erreichen.

1. Erstellen Sie im Webserver einen Endpoint für einen POST request
2. Senden Sie via CURL ein base64 encodetes GIF https://media0.giphy.com/media/t7MWRoExDRF72/giphy.gif?cid=790b76115ce51ce853466479360d6873&rid=giphy.gif und speichern Sie dieses als File.
3. Betten Sie das File in der index.html Webseite ein.