XAMPP: SSL/HTTPS für lokale Projekte einrichten

In diesem Tutorial möchte ich euch zeigen, wie ihr eure XAMPP-Konfiguration so einrichten könnt, dass ihr eure lokalen PHP-Projekte auch über SSL beziehungsweise über eine HTTPS-URL im Browser erreichen könnt. Praktisch ist dies zum Beispiel für den Fall, dass auch eure Online-Website über HTTPS läuft und ihr so in beiden Fällen, also sowohl zum testen als auch in der echten Anwendung, dieselbe Linkstruktur nutzen könnt.

In meinem Tutorial über das Einrichten virtueller Domains hatte ich schon die Grundlagen dafür erklärt, wie man mit XAMPP und Apache beliebige Domains definieren kann, die dann auf ein lokales Verzeichnis in der XAMPP-Installation zeigen können. Nach dieser Einrichtung sind alle Domains im Browser zunächst nur über HTTP erreichbar. Um auch URLs über HTTPS zu erlauben, sind noch die folgenden weiteren zusätzlichen Schritte notwendig:

1. Zertifikat erstellen
2. VirtualHost definieren
3. Apache neu starten
4. Ausnahmen hinzufügen

Im folgenden möchten wir uns jeden dieser Schritte im Detail ansehen.

Zertifikat erstellen

Zunächst müssen wir uns im ersten Schritt ein eigenes SSL-Zertifikat erstellen. Zum Glück hält XAMPP bereits für uns ein kleines Skript dafür bereit, das wir folgendermaßen öffnen können:

1. Das Skript finden wir im Apache-Ordner der XAMPP-Installation, bei einer Standard-Installation unter Windows ist das der Pfad: C:\xampp\apache
2. In diesem Ordner finden wir die Datei makecert.bat. Mit einem Doppelklick auf die Datei können wir das Skript starten.

Nach dem Starten des Scripts öffnet sich die Kommandozeile, wo wir nur noch den Anweisungen folgen brauchen. Als erstes müssen wir ein Passwort für unseren Key eingeben. Das sollte so aussehen:

Generating a 2048 bit RSA private key
............+++
...................+++
writing new private key to 'privkey.pem'
Enter PEM pass phrase:

Hier können wir ein beliebiges Passwort verwenden und anschließend wiederholen. Es folgen weitere Fragen wie beispielsweise nach Land (Country Name), Stadt (Locality) oder Unternehmen (Organization Name). Hier können wir im Prinzip eingeben, was wir möchten oder einen Punkt eintippen, wenn wir das Feld freilassen möchten. Diese Angaben werden später in unserem Zertifikat verwendet. Als "Common Name" (FQDN = Fully Qualified Domain Name) geben wir statt einer konkreten Domain "localhost" ein, da wir das Zertifikat für unseren lokalen Host benötigen (wir können das selbe Zertifikat später trotzdem auch für URLs beliebigen anderen Namens verwenden, es ist also nicht nötig diesen Schritt für jede unserer Domains zu wiederholen). Fragen nach sogenannten Extra-Attributen wie nach einem "challenge password" oder einem "optional company name" können wir auslassen, indem wir sie mit der Eingabe eines Punkts quittieren. Zuletzt müssen wir das Passwort vom Beginn noch einmal wiederholen, dann wird das Zertifikat erstellt.

Der ganze Vorgang sieht dann beispielsweise so aus:

Generating a 2048 bit RSA private key
............+++
...................+++
writing new private key to 'privkey.pem'
Enter PEM pass phrase:
Verifying - Enter PEM pass phrase:
-----
You are about to be asked to enter information that will be incorporated
into your certificate request.
What you are about to enter is what is called a Distinguished Name or a DN.
There are quite a few fields but you can leave some blank
For some fields there will be a default value,
If you enter '.', the field will be left blank.
-----
Country Name (2 letter code) [AU]:DE
State or Province Name (full name) [Some-State]:NRW
Locality Name (eg, city) []:BOT
Organization Name (eg, company) [Internet Widgits Pty Ltd]:STT
Organizational Unit Name (eg, section) []:WEB
Common Name (e.g. server FQDN or YOUR name) []:localhost
Email Address []:local@example.com

Please enter the following 'extra' attributes
to be sent with your certificate request
A challenge password []:.
An optional company name []:.
Enter pass phrase for privkey.pem:
writing RSA key
Signature ok
subject=/C=DE/ST=NRW/L=BOT/O=STT/OU=WEB/CN=localhost/emailAddress=local@example.com
Getting Private key
        1 Datei(en) verschoben.
        1 Datei(en) verschoben.

-----
Das Zertifikat wurde erstellt.
The certificate was provided.

Drücken Sie eine beliebige Taste . . .

Nun ist unser Zertifikat erstellt und dieser Schritt ist abgeschlossen. Das fertige Zertifikat wurde in den Ordnern C:\xampp\apache\conf\ssl.crt und C:\xampp\apache\conf\ssl.key abgelegt, sofern wir XAMPP in C:\xampp installiert haben.

VirtualHost definieren

Im nächsten Schritt müssen wir für jede unserer Domains, die wir über HTTPS aufrufbar machen möchten, einen neuen VirtualHost in der Datei C:\xampp\apache\conf\extra\httpd-vhosts.conf einrichten, ähnlich wie wir es auch schon in dem ersten Tutorial gemacht haben.

An dieser Stelle ist es wichtig zu wissen, dass HTTP über Port 80 läuft, SSL dagegen jedoch über Port 443. Im folgenden definieren wir die URL example.com, die sowohl über http://www.example.com als auch über https://www.example.com erreichbar sein soll. Der erste Block <VirtualHost *:80> gilt für alle Anfragen über Port 80 (also für alle Anfragen beginnend mit http://...) und sieht in etwa so aus, wie die Blöcke aus dem ersten Tutorial. Unter DocumentRoot können wir wieder das Stammverzeichnis angeben.

# HTTP
<VirtualHost *:80>
 DocumentRoot "C:/xampp/htdocs/myproject"
 ServerName example.com
 ServerAlias www.example.com
</VirtualHost>

# HTTPS
<VirtualHost *:443>
 DocumentRoot "C:/xampp/htdocs/myproject"
 ServerName example.com
 ServerAlias www.example.com
 SSLEngine on
 SSLCertificateFile "conf/ssl.crt/server.crt"
 SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

Die HTTPS-Anfragen werden über den zweiten Block "<VirtualHost *:443>" definiert (Port 443). Die Angaben zum DocumentRoot-Verzeichnis, ServerName und ServerAlias sind identisch zu HTTP. Zusätzlich müssen wir nun aber noch SSL einschalten und Angaben zu unserem SSL-Zertifikat und Key machen. Damit sagen wir dem Server, dass er SSL nutzen soll (SSLEngine on) und wo er die entsprechenden Dateien findet. Wie man sieht, sind es die Ordner, in denen gerade unser Zertifikat gespeichert wurde.

In dem Beispiel hier haben wir nur eine URL definiert, die sowohl über HTTP als auch über HTTPS erreichbar sein soll. Jede weitere Domain beziehungsweise URL muss genauso definiert werden, wir können beliebig viele Blöcke dieser Art untereinander schreiben.

Apache neu starten

Damit unsere Änderungen aktiv werden, müssen wir jetzt - natürlich erst nach Speicherung der geänderten Datei - Apache neu starten. Dafür öffnen wir das XAMPP Control Panel und klicken hinter dem Modul "Apache" auf "Stop" und anschließend wieder auf "Start", damit der Server neu mit der neuen Konfiguration startet.

Ausnahmen hinzufügen

Nun sind wir mit unserer Konfiguration fertig. Wenn wir jedoch eine unserer frisch definierten HTTPS-Seiten im Browser aufrufen, erhalten wir unter Umständen (je nach Browser und Browsereinstellungen) die Fehlermeldung "Diese Verbindung ist nicht sicher" mit dem Fehlercode SEC_ERROR_UNKNOWN_ISSUER. Dazu liefert zum Beispiel der Firefox-Browser den abschreckenden Text "Der Inhaber von ... hat die Website nicht richtig konfiguriert. Firefox hat keine Verbindung mit der Website aufgebaut, um ihre Informationen vor Diebstahl zu stützen". Kurz gesagt: Wir können unsere Website trotz erfolgreicher Konfiguration gar nicht aufrufen.

Der Grund dafür ist, dass wir das Zertifikat selbst erstellt haben und Firefox, Chrome und andere Browser von sich aus nur Zertifikaten von offiziellen Zertifizierungsstellen traut. Für unsere lokalen Testzwecke wäre das natürlich übertrieben, weswegen wir getrost auf den Button "Ausnahme hinzufügen..." klicken können. In dem sich nun öffnenden Dialog sollten wir die Option "Diese Ausnahme dauerhaft speichern" aktivieren, sonst werden wir bei jedem Aufruf erneut gefragt. Anschließend können wir auf "Sicherheits-Ausnahmeregel bestätigen" klicken und sollten von nun an unsere Website über die HTTPS-URL sehen können.