Zum Inhalt

Termin 3: Sessionmanagement, Sicherheit, API-Endpunkte & Fachgespräch

In dieser Einheit implementieren Sie eine leichtgewichtige Form des Sessionmanagements. Zusätzlich sichern Sie Ihre Web-Applikation gegen grundlegende Angriffe auf eine Webseite ab und erstellen einen API-Endpunkt.

Erstes Fachgespräch

In diesem Termin wird überprüft, ob Sie sich intensiv mit Ihrem Projekt und den Inhalten der Vorlesung auseinandergesetzt haben. Dabei stehen insbesondere folgende Punkte im Fokus:

  • Verständnis Ihres Projekts und der zugrunde liegenden Idee
  • Verständnis des eigenen Programmcodes einschließlich Code-Struktur, Syntax und Funktionsweise
  • Fähigkeit, zentrale Entscheidungen im Projekt zu begründen
  • Verständnis der in der Vorlesung behandelten Konzepte und Methoden
  • Fähigkeit zu erklären, welche Inhalte aus der Vorlesung im Projekt angewendet wurden
  • Einordnung, wo und in welchen praktischen Kontexten diese Technologien oder Konzepte eingesetzt werden können

Sollte der Eindruck entstehen, dass diese Punkte bei beiden Fachgesprächen nicht ausreichend erfüllt sind, werden keine Bonuspunkte vergeben. Im schlimmsten Fall kann dies zudem dazu führen, dass kein Testat erteilt wird.

Vorbereitung

Erledigen Sie diese Aufgaben VOR dem Übungstermin

Voraussetzung: Alle Seiten aus Termin 2 erzeugen mit den Datenbankinhalten standardkonformen HTML-Code andhand der vorgegebenen MVC-Architektur.

  1. Machen Sie sich die Funktionsweise von Sessions in PHP klar und überlegen Sie sich, wo man Sessions einsetzen muss.
  2. Machen Sie sich vertraut mit den Angriffen und den Gegenmaßnahmen zu Cross Site Scripting und SQL-Injection.
  3. Überlegen Sie sich, welche Seiten von ihrem Projekt anfällig für XSS und SQL-Injection sind

Aufgaben

Sessionmanagement

  1. Der Kunde soll auf seiner Statusseite nur diejenigen Pizzen sehen, die er selbst zuletzt bestellt hat. Implementieren Sie dieses Feature mittels Sessionverwaltung.

  2. Um es simpel zu halten: Für jede neue Bestellung soll ein neuer Session-Eintrag angelegt werden. Die vorherige Bestellung wird nicht ergänzt, sondern ersetzt.

  3. Prüfen Sie Ihre Ergebnisse, indem Sie gleichzeitig zwei Bestellungen in unterschiedlichen Browsern – oder einmal im normalen Fenster und einmal im privaten Fenster – erstellen. So können Sie kontrollieren, ob die Session korrekt funktioniert und jede Bestellung eindeutig voneinander getrennt bleibt.

  4. Schauen Sie sicher zusätzlich in den Dev-Tools unter Application den Cookie PHPSESSID an und versuchen Sie zu verstehen was dieser macht.

Authentifizierung für Bäcker und Fahrer

Achtung

Die Authentifizierung ist freiwillig und fließt nicht in die Bewertung ein.

  1. Überlegen Sie sich, wie Sie eine einfache Authentifizierung für Bäcker und Fahrer umsetzen können.

  2. Implementieren Sie einen Login-Mechanismus auf Basis von Sessions.

  3. Schützen Sie die Routen /baker und /driver: Ein Zugriff ohne Login soll nicht möglich sein. Leiten Sie in diesem Fall auf die Login-Seite weiter.

  4. Implementieren Sie zusätzlich einen Logout, der die Session löscht.

  5. Testen Sie die Zugriffskontrolle, indem Sie die geschützten Seiten einmal mit gültigem Login und einmal ohne Login aufrufen.

  6. Für diese einfache Übungsvariante ist keine Anpassung der Datenbank notwendig. Verwenden Sie stattdessen feste Zugangsdaten und speichern Sie den Login-Status in der Session. Alternativ können Sie auch gern die Datenbank erweitern.

Sicherheit

  1. Verhindern Sie SQL-Injection mit Hilfe von real_escape_string oder prepared-statements. Überlegen Sie, an welchen Stellen der Anwendung ein solcher Angriff möglich wäre und verhindern Sie ihn.

  2. Verhindern Sie Cross Site Scripting mit Hilfe von htmlspecialchars. Überlegen Sie an welchen Stellen der Anwendung ein solcher Angriff möglich wäre und verhindern Sie es.

  3. Geben Sie in die Adresszeile folgenden String ein und schicken Sie die Bestellung ab: 

    <h1>Te"s't</h1>

  4. Dieser String sollte in der Datenbank und an allen Stellen genau so gespeichert bzw. angezeigt werden und dabei zu keinem Zeitpunkt Fehler verursachen oder sogar gerendert werden.

API-Endpunkt

In der finalen Lösung der Kundenseite sollen die Statusinformationen zu den Pizzen in Echtzeit aktualisiert werden. Dies geschieht clientseitig über JavaScript, das die Daten per AJAX regelmäßig vom Server abfragt, ohne dass die gesamte Seite neu geladen werden muss. Dafür muss es auf der Serverseite einen API-Endpunkt geben, der genau diese Rohdaten liefert (in einem Standardformat wie JSON).

  1. Erstellen Sie dafür basierend auf unserer MVC-Architektur einen API-Endpunkt namens statusApi samt aller benötigten Dateien und Routen. Dieser Endpunkt soll keine HTML-Ausgabe erzeugen, sondern "nur" die Daten der bestellten Pizzen im JSON-Format zurückliefern. Das können Sie realisieren indem Sie in generateResponse statt renderHtml() die Methode renderJson() nutzen. Schauen Sie im BaseController was der Unterschied ist!

  2. Überlegen Sie sich, welche Daten der Endpunkt von der Datenbank benötigt, um die gewünschten Funktionalität zu ermöglichen.

  3. Die Daten, die der Endpunkt benötigt, können sofern bereits ein bestehendes Model passende Methoden für diese Informationen bereitstellt – direkt daraus bezogen werden.

  4. Testen Sie die korrekte Funktionsweise von dem Endpunkt statusApi mittels eines direkten Aufrufs der Route /statusApi im Browser. Je nach Browser wird die Antwort mehr oder weniger leserlich dargestellt. Alternativ können Sie den Netzwerk-Tab von den Dev-Tools nutzen.

Meilenstein

Stand jetzt sind Sessionmanagement, grundlegende Sicherheitsmaßnahmen und der API-Endpunkt umgesetzt. Damit ist das Projekt funktional vorbereitet für die clientseitige Echtzeit-Aktualisierung im nächsten Schritt.

Nachbereitung

Setzen Sie noch eventuell fehlende Teile der obigen Aufgabe bis zum Abgabetermin um.

Ergebnisse

Die folgenden Ergebnisse müssen für eine erfolgreiche Durchführung der Praktikumseinheit vorliegen:

Ergebnisse

  • Der Kunde "sieht" - dank Sessions - nur noch seine eigenen Bestellungen (auf der bisherigen Kundenseite und auf dem neuen statusApi Endpunkt)
  • Implementierung vom API-Endpunkt /statusApi basierend auf unserer MVC-Architektur.
  • Versenden der Statusdaten durch den Endpunkt /statusApi mittels JSON
  • Absicherung der gesamten Web-Applikation gegen SQL-Injection und Cross-Site-Scripting (XSS)