24 Sep / 2019
Author: Mahir Kukic Tags: There is no tags Comments: 0

Bookmark and Share

Statische Webseite mittels AWS hosten

Für viele Selbstständige, die gerade ins Business einsteigen und das Verlangen nach einer einfachen Internetpräsenz haben, als auch für diejenigen die jegliche Inhalte auf einer Webseite präsentieren möchten, kann eine statische Webseite ein guter Anfang sein. In diesem Blogeintrag möchte ich näherbringen wie einfach, kostengünstig und schnell solch eine statische Website mittels Amazon Web Services erstellt werden kann.

1. Übersicht der Konfiguration

Die statische Webseite kann mit nur einem einzigen AWS Service erstellt werden. Der AWS Simple Storage Service (auch S3 genannt) ist ein Service um Datenspeicher bereitzustellen und bietet hierbei die Möglichkeit mit einer html-Datei eine statische Webseite zu hosten. Wir nehmen uns den AWS internen DNS Service genannt Route 53 hinzu. Mit diesem DNS Service können wir zusätzlich eine Domäne registrieren und so konfigurieren, dass unsere Webseite über eine von uns definierte URL abrufbar ist. Folgende Abbildung soll die Konfiguration veranschaulichen:

website_1

2. Vorbereitung

Bevor wir mit der Einrichtung starten muss die zu reservierende Domäne vorher bekannt sein. In diesem Blog werde ich beispielhaft die Domäne demo.com verwenden. Des Weiteren sollte zuvor geprüft werden, ob die Domäne und der S3 Bucketname schon vergeben sind. Der S3 Bucketname muss hierbei dem Domain-Namen entsprechen. Das wäre dann ebenso demo.com. Sind Domain- und S3 Bucketname frei, so können wir mit der Einrichtung starten.

3. Einrichtung AWS S3/AWS Route 53

3.1 Domäne registrieren

Hierzu wechselt man in den Route 53 Service und wählt unter Registrierte Domänen -> Domäne registrieren die gewünschte Domäne aus die registriert werden soll. Für die Registrierung müssen zusätzlich einige Informationen zum Eigentümer der Domäne hinterlassen werden. Der ganze Prozess bis die Domäne schlussendlich registriert ist dauert nur wenige Minuten.

website_2

3.2 S3 Bucketerstellung

Mit dem S3 Service erstellt man das Bucket in dem die Files der Webseite abgelegt werden. Der Name des S3 Buckets muss zwingend mit dem Domänennamen identisch sein. In diesem Beispiel heißt das Bucket demo.com.
Unter den Eigenschaften des Buckets kann hier das „Hosten einer statischen Website“ aktiviert werden. Dabei legt man den Namen der html-Datei fest, die als Homepage fungiert. Der Name des Error-dokuments referenziert auf die html-Datei die einen gewissen Inhalt wiedergeben soll, falls die Webseite mal nicht erreichbar sein sollte.

website_3

Der Zugang zu den Files muss zudem öffentlich konfiguriert sein, damit der Inhalt der Webseite aufgerufen werden kann. Hierzu richten wir einen Read-Only Zugang ein:
Unter den Berechtigungen muss vorerst die Option „Blockieren jeglichen öffentlichen Zugriffs“ unter „Öffentlichen Zugriff blockieren“ ausgeschaltet werden.

website_4

Des Weiteren stellen wir die Bucket-Richtlinie so ein, dass jeder den Inhalt lesen darf. Mit folgender Richtlinie ist dies möglich:

{
"Version":"2012-10-17",
"Statement":[
{
"Sid":"PublicReadGetObject",
"Effect":"Allow",
"Principal":"*",
"Action":[
"s3:GetObject"
],
"Resource":[
"arn:aws:s3::: S3Bucketname/*"
]
}
]
}

website_5

Schlussendlich können nun die Dateien der Webseite in das S3 Bucket hochgeladen werden. Das Ganze kann jedoch auch kurz mit einer html-Datei mit folgendem Inhalt getestet werden:

My Website Home Page

Welcome to my website

Now hosted on Amazon S3!



Unter den Eigenschaften des Buckets kann über „Hosten einer statischen Website“ der Endpunkt (http://S3Bucketname.s3-website.eu-central-1.amazonaws.com) angeklickt werden um die Funktionalität zu testen. Der Output sollte wie folgt aussehen:

website_6

3.3 AWS Route 53 – Datensatz erstellen:

Nachdem die Registrierung der Domäne und das Erstellen des S3 Buckets erfolgt ist, begeben wir uns in die Gehostete Zone.

website_7

Hier erstellen wir nun einen neuen Datensatz.

website_8

Im Datensatz definieren wir den Alias der Domäne demo.com. Dieser referenziert auf das erstelle S3 Bucket demo.com.

website_9

Nun haben wir festgelegt, dass der Datenverkehr der Domäne demo.com an den erstellten S3 Bucket und damit an die Webseite weitergeleitet wird.
Fertig!
Die Webseite demo.com kann nun über den Browser aufgerufen werden.

4. Kosten

Die Kosten für eine statische Webseite sind mit Amazon Web Services sehr gering. Da nur zwei Services verwendet werden sind die Kosten sehr überschaubar. Anbei habe ich die Kostenangaben zu AWS Route 53 und S3 mit angegeben.

4.1 AWS Route 53

Für die Registrierung zahlt man je nach Top-Level Domäne einen anderen Betrag pro Jahr.
Folgende Liste zeigt die beliebtesten Top-Level-Domains mit den dazugehörigen Preisen.

website_10

Da wir einen Datensatz in der gehosteten Domäne erstellt haben, fallen grundsätzlich weitere Kosten an. Die Konfiguration die wir getätigt haben ist jedoch völlig kostenlos.

website_10

4.2 AWS S3

Die Kosten für S3 entstehen in unserer Anwendung nur für den genutzten Speicher. Für eine statische Webseite wird der Speicherplatz in der Regel < 1GB betragen. Folgende Darstellung soll die Kosten pro Gigabyte in der Region eu-central-1 (Frankfurt) veranschaulichen: website_11

Zusammenfassend lässt sich sagen, dass das Betreiben der Webseite pro Monat unter 2,- € liegt.

5. Tipp

Es gibt viele kostenfreie Templates für statische Webseiten die man sich aus dem Internet kostenfrei runterladen und bearbeiten kann. So ist es möglich innerhalb von wenigen Minuten eine Webvisitenkarte zu erstellen die vom Design her auch sehr ansprechend ist.

6. Fazit

Eine statische Webseite so mühelos und kostengünstig zu erstellen war bisher kaum möglich. Mittels Cloud Computing und Amazon Web Services ist dies heutzutage ein Kinderspiel. Zudem kommt der Luxus hinzu, dass die Bereitstellung eines Servers und dessen Verwaltung/Konfiguration entfällt. Daher ist dieser Ansatz sehr zu empfehlen.

Weiterführende Links

https://docs.aws.amazon.com/de_de/AmazonS3/latest/dev/website-hosting-custom-domain-walkthrough.html
https://aws.amazon.com/de/route53/pricing/
https://aws.amazon.com/de/s3/pricing/


Blog - Kommentar verfassen

Please notice, that all fields markes by * have to get filled out in order to be able to publish the comment.

Security check *