In einem der letzten Blog-Beiträge ging es um die Installation und Konfiguration eines Matrix Synapse Servers. Mit dem eigenen Synapse Server kann man sich mit einem beliebigen Client für Matrix verbinden. Der bekannteste Client ist hier sicherlich Element: Diesen Client gibt es als Programm/App für alle populären Plattformen. Daneben gibt es auch eine Web-Version dieses Clients.
Der Artikel zeigt die Installation dieser Web-Variante von Element auf dem eigenen Server mit Ubuntu 20.04 und nginx. Das Vorgehen sollte aber bei anderen Distributionen analog ablaufen.
Update-Historie (letztes Update: 18.06.2021)- 18.06.2021:
- Konfiguration acme.sh, so dass immer Zertifikate über Let’s Encrypt bezogen werden.
Inhalt
Voraussetzungen/Konzept
Ich gehe in diesem Artikel davon aus, dass bereits ein Matrix Synapse Server installiert wurde. Die beispielhafte Domain für Matrix Synapse ist in diesem Artikel matrix.meinedomain.de. Element wird nun auf dem gleichen System wie der Matrix Server installiert.
Daher sollte bereits folgendes fertig auf dem Server eingerichtet worden sein, da in diesem Artikel nicht näher darauf eingegangen wird:
- nginx
- acme.sh
Details zur Installation und Konfiguration dieser beiden Komponenten sind dem Artikel Matrix Synapse auf Ubuntu Server 20.04 LTS mit nginx, PostgreSQL und Let’s Encrypt zu entnehmen.
Aus Gründen der Sicherheit wird generell nicht empfohlen, Element auf der gleichen (Sub-)Domain wie Matrix Synapse laufen zu lassen. Der Grund dafür ist das Risiko von XSS (Cross Site Scripting), siehe dazu auch das offizielle GitHub-Repository von Element.
Daher nutze ich in diesem Tutorial für Element die separate Domain element.meinedomain.de.
nginx als Webserver für Element
Wie schon für den eigentlichen Matrix Synapse Server nutzen wir hier nginx als Reverse Proxy. Da sowohl Matrix Synapse, als auch Element auf der gleichen Maschine laufen sollen, sollte die Grundstruktur bereits vorhanden sein und muss lediglich ein wenig angepasst werden.
TLS-Zertifikate über acme.sh ausstellen
Damit für die Element-Domain (element.meinedomain.de) TLS-Zertifikate über Let’s Encrypt ausgestellt werden können, muss zunächst einmal der HTTP-Gateway modifiziert werden:
nano /etc/nginx/conf.d/HttpGateway.conf
Hier ist bereits der server_name für Matrix Synapse hinterlegt (matrix.meinedomain.de). Hier ergänzen wir nun noch die neue Domain für Element: element.meinedomain.de
server {
listen 80 default_server;
listen [::]:80 default_server;
server_name matrix.meinedomain.de element.meinedomain.de 192.168.178.60;
root /var/www;
location ^~ /.well-known/acme-challenge {
default_type text/plain;
root /var/www/letsencrypt;
}
location / {
return 301 https://$host$request_uri;
}
}Damit die Änderungen übernommen werden, wird der Webserver kurz neu geladen:
service nginx reload
Das Ausstellen der TLS-Zertifikate läuft analog zu Matrix Synapse ab, daher hier nur im Schnelldurchgang.
Zunächst wird die Verzeichnisstruktur für die Zertifikate vorbereitet:
mkdir -p /etc/letsencrypt/element.meinedomain.de/rsa mkdir -p /etc/letsencrypt/element.meinedomain.de/ecc chown -R www-data:www-data /etc/letsencrypt/element.meinedomain.de chmod -R 775 /etc/letsencrypt/element.meinedomain.de
Nun wechseln wir auf den Let’s Encrypt User:
su - letsencrypt
Nun können auch schon die Zertifikate über Let’s Encrypt erzeugt werden (RSA und ECDSA):
acme.sh --issue -d element.meinedomain.de --server letsencrypt --keylength 4096 -w /var/www/letsencrypt --key-file /etc/letsencrypt/element.meinedomain.de/rsa/key.pem --ca-file /etc/letsencrypt/element.meinedomain.de/rsa/ca.pem --cert-file /etc/letsencrypt/element.meinedomain.de/rsa/cert.pem --fullchain-file /etc/letsencrypt/element.meinedomain.de/rsa/fullchain.pem --reloadcmd "sudo /bin/systemctl reload nginx.service"
acme.sh --issue -d element.meinedomain.de --server letsencrypt --keylength ec-384 -w /var/www/letsencrypt --key-file /etc/letsencrypt/element.meinedomain.de/ecc/key.pem --ca-file /etc/letsencrypt/element.meinedomain.de/ecc/ca.pem --cert-file /etc/letsencrypt/element.meinedomain.de/ecc/cert.pem --fullchain-file /etc/letsencrypt/element.meinedomain.de/ecc/fullchain.pem --reloadcmd "sudo /bin/systemctl reload nginx.service"
Nun meldet man sich wieder mit dem User ab:
exit
Damit ist die Erstellung der Zertifikate auch schon abgeschlossen.
Virtueller Host für Element
Als nächstes folgt der vHost für Element selbst:
nano /etc/nginx/conf.d/element.meinedomain.de.conf
Hier ist folgender Inhalt zu hinterlegen:
server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name element.meinedomain.de;
# SSL configuration
# RSA certificates
ssl_certificate /etc/letsencrypt/element.meinedomain.de/rsa/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/element.meinedomain.de/rsa/key.pem;
# ECC certificates
ssl_certificate /etc/letsencrypt/element.meinedomain.de/ecc/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/element.meinedomain.de/ecc/key.pem;
# This should be ca.pem (certificate with the additional intermediate certifica$
# See here: https://certbot.eff.org/docs/using.html
# ECC
ssl_trusted_certificate /etc/letsencrypt/element.meinedomain.de/ecc/ca.pem;
# Include SSL and header snippets
include /etc/nginx/snippets/ssl.conf;
include /etc/nginx/snippets/headers.conf;
# Make sure to set Content-Security-Policy when this is not aleady done with the default headers.
add_header Content-Security-Policy "frame-ancestors 'none'";
# Disable error and access log.
access_log off;
error_log off;
# If you don't wanna serve a site, comment this out
root /var/www/element;
index index.html index.htm;
}Wir profitieren nun davon, dass wir die allgemeinen SSL- und Header-Einstellungen im Artikel über Matrix Synapse bereits ausgelagert hatten. Diese können nun einfach wieder per include eingebunden werden. Lediglich die Pfade zu den Zertifikaten sind hier wieder anzugeben, da wir ja andere Zertifikate als für Matrix Synapse verwenden.
Zum Abschluss laden wir die nginx Konfiguration nochmals neu:
service nginx reload
Installation und Konfiguration Element
Nachdem nginx für die Nutzung von Element vorbereitet wurde, kann Element nun auf dem System installiert werden.
Dazu besorgen wir uns zunächst einmal die aktuellste Version von der Element Release-Seite. Hier ist darauf zu achten, keine RC-Version (Release Candidate) zu wählen, sondern den aktuellsten stabilen Release:
wget https://github.com/vector-im/element-web/releases/download/v1.7.23/element-v1.7.23.tar.gz
Dieses Paket wird nun entpackt und in das entsprechende Verzeichnis zu verschieben:
tar -xf element-v1.7.23.tar.gz mv element-v1.7.23 /var/www/element rm element-v1.7.23.tar.gz
Als nächstes kopieren wir die Beispielkonfiguration und öffnen die Datei zur Bearbeitung:
cp /var/www/element/config.sample.json /var/www/element/config.json nano /var/www/element/config.json
Hier wird erst einmal die Basis-URL und der Server-Name (von Matrix Synapse) angepasst:
"default_server_config": {
"m.homeserver": {
"base_url": "https://matrix.meinedomain.de",
"server_name": "matrix.meinedomain.de"
},Ebenfalls wird die Standard-Sprache auf Deutsch gesetzt:
"defaultCountryCode": "DE",
Auf Grund des Datenschutzes sollte folgender Block ganz entfernt werden. Piwik (neuerdings bekannt als Matomo) ist hierbei eine Analyse-Software:
"piwik": {
"url": "https://piwik.riot.im/",
"whitelistedHSUrls": ["https://matrix.org"],
"whitelistedISUrls": ["https://vector.im", "https://matrix.org"],
"siteId": 1
},Optional: Wenn ein eigener Server für Jitsi-Meet (für Videokonferenzen aus Element heraus) verfügbar ist, kann dieser ganz unten in der Konfiguration hinterlegt werden (hier mit der beispielhaften Domain jtisi.meinedomain.de):
"jitsi": {
"preferredDomain": "jitsi.meinedomain.de"
}Wer sich für die Installation eines eigenen Jitsi-Meet-Servers interessiert, findet im Artikel Jitsi Meet: Videokonferenz-System unter Ubuntu Server mit nginx eine detaillierte Anleitung.
Wenn die Konfiguration von Element angepasst wurde, müssen nur noch die Verzeichnisrechte des Element-Verzeichnisses angepasst werden:
chown -R www-data:www-data /var/www/element
Nutzung der eigenen Element-Instanz
Nun kann auch schon die neu erstelle Instanz von Element per Browser aufgerufen werden: https://element.meinedomain.de
Hier gibt es nun erst einmal von den Funktionen/vom Look&Feel her keine Unterschiede zur „offiziellen“ Instanz von Element (app.element.io). Hier ist es also nicht nur möglich, sich an die eigens gehostete Instanz von Matrix Synapse anzumelden, sondern auch an einen beliebigen andere Matrix-Server (z.B. matrix.org).
Update Element
In regelmäßigen Abständen werden Updates von Element veröffentlicht. Der folgende Abschnitt zeigt, wie man hier am einfachsten ein Update durchführen kann.
Zunächst sollte ermittelt werden, ob überhaupt ein Update verfügbar ist. Dazu lassen wir uns die Version von Element ausgeben:
cat /var/www/element/version
Diese Version vergleichen wir mit dem aktuellsten Release aus dem Element GitHub-Repository. Wenn hier eine neuere Version verfügbar ist, kann ein Update durchgeführt werden.
Dazu deaktivieren wir zunächst einmal den Zugang zu Webversion von Element über den Webserver
mv /etc/nginx/conf.d/element.meinedomain.de.conf /etc/nginx/conf.d/element.meinedomain.de.conf_disabled service nginx reload
Anschließend wird das alte Web-Verzeichnis umbenannt:
mv /var/www/element /var/www/element_old
Nun folgt der Download der aktuellsten Version (die Versions-Nummer ist hier natürlich anzupassen) und das entpacken in das Web-Verzeichnis von Element:
wget https://github.com/vector-im/element-web/releases/download/v1.7.23/element-v1.7.23.tar.gz tar -xf element-v1.7.23.tar.gz mv element-v1.7.23 /var/www/element
Die alte Konfiguration wird nun in die neue Installation übernommen:
cp /var/www/element_old/config.json /var/www/element/config.json
Nun müssen noch die Rechte für das Web-Verzeichnis gesetzt werden:
chown -R www-data:www-data /var/www/element
Am Schluss wird der der Zugriff auf Element über den Webserver wieder aktiviert:
mv /etc/nginx/conf.d/element.meinedomain.de.conf_disabled /etc/nginx/conf.d/element.meinedomain.de.conf service nginx reload
Nun kann Element wieder wie gewohnt verwendet werden.
Nach dem Update sollte man nochmals die Funktion prüfen und kann anschließend die alte Installation und das Archiv der neusten Version vom System entfernen:
rm element-v1.7.23.tar.gz rm -r /var/www/element_old
Fazit
Dieser Artikel hat gezeigt, wie ihr eure eigene Instanz von Element/Web installieren und konfigurieren könnt.
Zusammen mit dem eigenen Matrix Synapse Server habt ihr nun auch einen autonomen Webclient für Matrix.
Weiterführende Artikel
- Matrix Synapse auf Ubuntu Server 20.04 LTS mit nginx, PostgreSQL und Let’s Encrypt
- Jitsi Meet: Videokonferenz-System unter Ubuntu Server mit nginx
Links
- Matrix (Kommunikationsprotokoll) (Wikipedia)
- Matrix Synapse (GitHub)
- Element (offizielle Website)
- element-web (GitHub)
Ähnliche Artikel:
Matrix Synapse auf Ubuntu Server 20.04 LTS mit nginx, PostgreSQL und Let’s Encrypt
Nextcloud auf Ubuntu Server 20.04 LTS mit nginx, MariaDB, PHP, Let’s Encrypt, Redis und Fail2ban
RSA und ECDSA-Zertifikate mit nginx (Hybrid-Lösung)
Nextcloud auf Ubuntu Server 18.04 LTS mit nginx, MariaDB, PHP, Let’s Encrypt, Redis und Fail2ban
Super, vielen Dank für diesen Artikel.
Ich bekomme aber ein 403 Fehler beim aufrufen der URL.
Hast Du einen Tipp?
Hi Robert,
hier würde ich in die Webserver-Logs schauen (besonders die error.log). Hier sollte drin stehen, auf welche Datei er zugreifen will und was daran evtl. nicht passt.
Gruß,
Jan
2021/04/08 15:09:07 [error] 6284#6284: *7 directory index of „/var/www/element/“ is forbidden, client: 185.161.XXX.XXX, server: element.meinedomain.de, request: „GET / HTTP/2.0“, host: „element.meinedomain.de“
Steht das gleiche wie im Browser. So was wie eine index.php gibt es nicht, oder?
Hi Robert,
irgendwie versucht er, das Verzeichnis aufzulisten. Er sollte allerdings die index.html anzeigen. Dies wird eigentlich durch folgende Zeilen in der nginx-Konfiguration erledigt:
root /var/www/element;index index.html index.htm;
Sind diese bei dir vorhanden?
Sind die Verzeichnisrechte korrekt gesetzt?
Gruß,
Jan
Jetzt klappt alles.
Ich habe auf v1.7.25 aktualisiert. Jetzt ist in dem Verzeichnis auch eine index.html und geht funktioniert Element Web.
Vielen Dank für Deine Hilfe.
Hi Robert,
OK, dann lag es wohl an der Element-Version, oder?
Auf jeden Fall danke für die Rückmeldung.
Gruß,
Jan
Danke.
Matrix/Elements gefällt mir immer besser, leider ist die Verbreitung noch nicht allzu hoch.
Hallo zusammen,
ich habe schon eine eigene Matrix Server aufgesetzt. Dieser läuft in einer VM, ich würde gerene eine weiter VM aufsetzten und dort element installieren.
Ist das Sinnvoll und klappt dann auch die Anleitun?
Hi,
ja, Element muss nicht auf der gleichen Maschine wie Matrix installiert werden. Du kannst dazu also auch eine zweite VM verwenden.
Gruß,
Jan
Hi,
ich bin gerade dabei einen Matrix-Server zu installieren und frage mich wie sinnvoll die Nutzung der Webapp Element im Browser ist.
Wenn der Browser geschlossen wird, verliert/vergisst er alle Webseiten-Daten (jedenfalls bei mir). Müsste beim nächsten Login im Browser nicht die Passphrase für die Schlüsselsicherung abgefragt werden um E2E-Verschlüsselung zu nutzen ? Da wäre es doch besser die Desktop-App zu nutzen.
Zweite Frage :
Inwieweit müsste deine Jitsi-Anleitung angepasst werden damit sie mit der Matrix-Instanz zusammenspielt ?
Ich würde sie auf dem gleichen Server installieren und nur dafür nutzen.
Auf dem Server läuft auch Coturn.
Noch ein Tipp zur Benachrichtigung über Element-Updates :
wer ein Github-Account hat, kann sich über neue Release benachrichtigen lassen.
Dazu ist eine Benachrichtigungsaktivierung im eigenen Github-Account für das Element-Repository nötig.
P.S:
Danke für die tollen Anleitung.
Sie gehören zu den besten des WWW.
Gruss
Tom
Hi Tom,
ja, bei der Web-Version (wenn der Browser beim Schließen alle Cookies etc. löscht) musst du dann immer die neue Sitzung mit einem zweiten Gerät (z.B. Element App) oder mit dem Sicherungsschlüssel freischalten. Das ist der Nachteil zu den Apps (Desktop/Mobil).
Jitsi wird bei Matrix nur verwendet, wenn mehr als 2 Teilnehmer in der Konferenz sind. Das ganze funktioniert recht gut – jedoch nur mit der Browser-Version von Element: Nur diese beachtet die „preferredDomain“ in der Synapse-Konfiguration. Die Apps für Desktop und Mobil können dies (noch) nicht, diese verwenden dann immer eine Jitsi-Instanz von den Matrix-Machern.
Seitens Jitsi ist hier nichts weiter zu beachten. Vielleicht sollte man hier aber nicht das Feature „Secure Domain“ einrichten, denn ansonsten muss man immer bei einem Video-Call zunächst Benutzer und Passwort eingeben.
Gruß,
Jan
Ich muss hier mal für diese tollen Tutorials danken. Es funktioniert alles zu 100% wie beschrieben :)
Eine Frage habe ich: Ich habe als matrix domain keine subdomain sondern die hauptdomain genommen. Es funktioniert auch alles wunderbar. Wenn ich allerdings die Hauptdomain in einen Browser eingebe, bekomme ich Fehler 404. Kann ich irgendwo eine index.html inpacken, damit es schöner aussieht?
Danke vorab.
Sorry, habe den Fehler gefunden (Verzeichnis in /etc/nginx/conf.d/mydomain.conf
Hi Dominic,
ok, dann hat sich das Problem ja mehr oder weniger von selbst gelöst. Trotzdem danke für die Rückmeldung!
Gruß,
Jan
Hallo Jan
Sehr tolle Artikel und Tutorials hast Du auf Deinem Blog. Gratuliere!
Martix habe ich nach Deiner Anleitung intalliert. Dies jedoch mit einem separat installiertem Nginx Reverse Proxy. Die Anpassung ging gut, da ich beim Proxypass nur localhost zu der IP des Matrix Servers anpassen musste.
Bei Deiner Anleitung zu Element möchte ich dies auch machen. Dazu habe ich zwei Fragen. Nur steige ich nicht dahinter, welche Anpassungen ich vornehmen muss, damit der Reverse Proxy „merkt“, auf welcher IP Matrix/Element läuft. Wie habe ich vorzugehen? Und zweitens, welche Konfigurationen sind konkret notwendig, wenn Matrix und Element auf separaten Servern betrieben werden würden?
Herzlichen Dank für Deine Antwort und Grüsse
Adrian