Schicke Verzeichnisauflistung für deinen Webserver

Wer auf seinem Server einige Ordner als Downloadbereich freigeben möchte, weiß sicherlich, dass diese Ansicht absolut bescheiden aussieht. Apache, nginx und Co. bieten diese Funktionalität bloß rudimentär an. Im Grunde soll ein Webserver ja eigentlich zum Hosten von Webseiten oder anderen Anwendungen genutzt werden. Aber ein Webspace ist auch nur ein Stück Speicherplatz im Internet. Was also tun, wenn einem die spartanische Darstellung partout missfällt? Die Lösung könnte beispielsweise “h5ai” lauten. Das Akronym steht für HTML5 Apache Index. Mittlerweile wird neben Apache ebenso nginx, lighttpd und Cherokee unterstützt. Das Projekt rüstet quasi eine optisch ansprechende Verzeichnisdarstellung nach und ermöglicht darüber hinaus zahlreiche Zusatzfunktionen, wie eine Suchfunktion, QR-Codes, Fotogalerie, verschiedene Ansichten und mehr.

Trotz simpler Installation, die Sicherheit nicht vernachlässigen

Die Installation könnte kaum einfacher sein. Ladet lediglich in den Ordner, wo euer Downloadverzeichnis beginnen soll, den Inhalt des Zip-Archivs von h5ai hoch. Nun benötigt ihr noch einen Eintrag in die Konfigurationsdatei eures Webservers. Bei Apache erfolgt das beispielsweise in der httpd.conf oder einer .htaccess direkt im Download-Ordner. Über DirectoryIndex wird dem Server mitgeteilt, wie er beim Aufruf des Downloadbereichs zu verfahren hat. Damit h5ai die Darstellung der Verzeichnisse ändert, suggeriert der Konfigurationseintrag eine “Umleitung” der herkömmlichen Index-Dateien. Auf der Projekt-Seite findet ihr dazu die nötigen Angaben bereits vorgefertigt. Vom Prinzip her, recht simpel.

Sicherheit ist das A und O — Verzeichnisse schützen
Sicherheit ist das A und O — Verzeichnisse schützen

Das Verzeichnis _h5ai enthält alle benötigten Ressourcen. Darunter auch eine Übersicht, welche euch zeigt, was euer Server so hergibt. Diese Anzeige müsst ihr schützen. Darüber könnten Angreifer sonst etwa die eingesetzte PHP-Version ermitteln. Hierzu benennt ihr das Verzeichnis einfach um, am besten in eine kryptische Bezeichnung. In der Serverkonfiguration muss der Pfad natürlich anschließend korrigiert werden. Nun Bedarf es noch eines Dateischutzes. Ihr könnt keinesfalls den ganzen Ordner sperren, da sonst für Außenstehende jedes Mal eine Passwortabfrage erscheinen würde und Darstellungsfehler auftreten. Also schützt ihr genau drei Dateien — index.html im Ordner _h5ai sowie beide JSON-Dateien im Verzeichnis config. Bei Apache sieht das beispielsweise so aus:

<Files index.html>
AuthType Basic or Digest
AuthName "Login"
AuthUserFile .../.htpasswd
Require valid-user
Satisfy all
</files>

Legt die .htaccess Dateien in die jeweiligen Ordner. Das war’s, eure Installation wäre damit abgesichert.

Verzeichnisse im zeitgemäßen responsiven HTML5-Design

So, nach dieser kleinen Vorarbeit ist euer Downloadbereich einsatzbereit. h5ai bietet zahlreiche Einstellungen, sodass ich sie hier gar nicht alle aufzählen kann. Daher verweise ich auf die options.json. Dort steht alles gut dokumentiert drin. Setzt auf jeden Fall den kryptischen Ordnernamen bei den zu ignorierenden Objekten ein. Ansonsten seht ihr diesen später in der Auflistung. Nun könnt ihr all eure Dateien und Ordner in das Downloadportal packen. In meinen Augen eine supereinfache Sache. Das Projekt ermöglicht unwahrscheinlich viele Funktionen, die schon fast an ein umfangreiches Downloadareal erinnern, allerdings mit deutlich geringerem Aufwand. Die komplette Featureübersicht findet ihr in der Entwickler-Demo von Lars Jung.

zeitgemäße responsive HTML5 Verzeichnisansicht
zeitgemäße responsive HTML5 Verzeichnisansicht

Bei meiner Suche nach einer solch simplen Verfahrensweise fand ich auch folgende gelungene Projekte: Directory Lister und pdirl. Für, welches der drei Anwendungen man sich letzten Endes entscheidet, hängt von den persönlichen Ansprüchen und Geschmäckern ab.


Avatar von reraiseace
Autor: Markus Werner (reraiseace) Twitterreraiseace, Google+reraiseace, Twittercb_werner
Ich bin Redaktionsvolontär bei der COMPUTER BILD in Hamburg, Fernstudent am Deutschen Journalistenkolleg und schreibe auf re{raise}ace privat über Webdesign und Programmierung. Seit 2015 schrieb ich auch regelmäßig für andere Medien.

0 Kommentare

Du kannst diesen Artikel nicht mehr kommentieren.