Verteilte Systeme

Webseiten im Client-Server-Modell

Outline

2. HTTP-Request

1. Client-Server

3. Sicherheit

4. Beispiel

Client-Server

Client

Anwendung auf einem Endgerät
Kommuniziert über Netzwerkverbindung
Schnittstelle zur Benutzung eines Dienstes
Übermittelt eingegebene Daten und zeigt erhaltene Daten aufbereitet an

Server

Leistungsstarker Computer
Stellt Ressourcen über das Netzwerk bereit
Nimmt Anfragen an, verarbeitet und beantwortet diese

HTTP-Requests

curl -i -H "Accept: application/json" \
	-H "Content-Type: application/json" \
	-X GET http://hostname/resource

3. Der Server erhält die Anfrage und verarbeitet diese

1. Im Client-Browser wird eine URL aufgerufen (GET)

2. Über DNS wird die URL zu einer IP-Adresse aufgelöst und die Anfrage dorthin geleitet

4. Der Client erhält eine Antwort vom Server

(z.B. HTML-Seite)

Der Weg einer Anfrage am Beispiel einer Webseite

HTTP-Methoden

```
GET
```
```
POST
```
```
PUT
```
```
DELETE
```

- Laden

- Senden

- Aktualisieren

- Löschen

...von Daten / Ressourcen

Response Formate

HTML
JSON
XML
Dateien
(PDF, Bilder, ...)

Sicherheit der Kommunikation

SSL/TLS

Verschlüsselungsprotokoll in der Datenübertragung
Schlüsselaustausch per "Handshake" und Eintragung als TLS-Record
HTTPS kennzeichnet die aktive Verwendung (secure)

Auth-Token

Anfragen mit Token verifizieren den Client
Wird beim Login-Vorgang generiert
Laufen nach bestimmter Zeit aus und müssen erneuert werden

Anwendungsbeispiel

Codebeispiel aus dem letzten Projekt (JS)

const authorizedRequest = async (route = '', params = {}, method = 'GET') => {
    try {
      if (!token) {
        throw new Error('missing token')
      }
      const hasBody = ['POST', 'PUT'].includes(method)
      const url = API_URL + route
      const headers = { Authorization: 'Bearer ' + token, ...(hasBody && jsonHeaders) }
      const body = JSON.stringify(params)
      const response = await fetch(
      	url + addParams(params), 
      	{method, headers, ...(hasBody && body)}
       )
      const data = await response.json()
      if (data) {
        return data
      }
    } catch (err) {
      console.log(err)
    }
  }