Roundcube & Nextcloud

January 24, 2026 by

Mário Santiago

Nextcloud & Roundcube: Professionelle Integration via External Sites – Der Komplett-Guide

In vielen Unternehmensumgebungen sind Nextcloud als Kollaborationsplattform und Roundcube als vertrautes Webmail-Interface gleichermaßen gefragt. Doch das ständige Hin- und Herschalten zwischen beiden Anwendungen stört den Workflow. Dieser Guide zeigt, wie Sie beide Dienste über die stabile “External Sites”-Methode nahtlos kombinieren – für einen zentralen Zugangspunkt ohne Performance- oder Sicherheitseinbußen.

💡 Wichtig: Diese Integration nutzt Iframes und ist daher stabiler als komplexe JavaScript-Bridges. Sie erhalten ein natives Gefühl, ohne dass die Systeme tief gekoppelt sind.

🎯 Voraussetzungen

Bevor Sie beginnen, stellen Sie sicher, dass folgende Komponenten vorhanden und konfiguriert sind:

✅ Nextcloud-Instanz – Eine laufende Nextcloud-Installation mit Admin-Rechten
✅ Docker & Docker Compose – Auf Ihrem Server/Host-System installiert
✅ PostgreSQL-Instanz – Eine bestehende PostgreSQL-Datenbank (z.B. von Paperless-ngx) inklusive:
- Hostname/Container-Namen der Datenbank
- Netzwerknamen, in dem die DB läuft
✅ Reverse Proxy – Nginx Proxy Manager (oder ähnliches) für das Routing
✅ Subdomain & SSL – Eine Subdomain (z.B. webmail.ihre-domain.de) mit gültigem SSL-Zertifikat
✅ Zugangsdaten IMAP/SMTP – Die Login-Daten Ihres Mailservers (hier: IONOS als Beispiel)

⚠️ Wichtig: Die in diesem Guide verwendeten Netzwerk-Namen (paperless_paperless-internal, nginx-proxy-manager-net) müssen exakt mit Ihren existierenden Docker-Netzwerken übereinstimmen. Passen Sie sie entsprechend an!

📊 Architektur-Übersicht

Bevor wir starten, hier ein Blick auf das Setup:

┌─────────────────────────────────────────────────────────┐
│                  Nextcloud (team.domain.de)             │
│  ┌───────────────────────────────────────────────────┐  │
│  │  Dashboard: "External Sites" App                  │  │
│  │  ┌─────────────────────────────────────────────┐  │  │
│  │  │  Iframe: Roundcube (webmail.domain.de)     │  │  │
│  │  └─────────────────────────────────────────────┘  │  │
│  └───────────────────────────────────────────────────┘  │
└─────────────────────────────────────────────────────────┘
                            ▲
                            │ HTTPS
┌─────────────────────────────────────────────────────────┐
│              Nginx Proxy Manager (Reverse Proxy)        │
│                  Routing: *.domain.de                   │
└─────────────────────────────────────────────────────────┘
                            ▲
                            │
┌─────────────────────────────────────────────────────────┐
│  Docker Network                                         │
│  ┌─────────────┐    ┌─────────────┐    ┌─────────────┐ │
│  │ Roundcube   │    │ PostgreSQL  │    │ Nextcloud   │ │
│  │ Container   │◄──►│ Container   │    │ Container   │ │
│  └─────────────┘    └─────────────┘    └─────────────┘ │
└─────────────────────────────────────────────────────────┘

1. Datenbank-Setup (PostgreSQL)

Wir nutzen eine vorhandene PostgreSQL-Instanz, um Ressourcen zu sparen. Falls Sie keine bestehende Instanz teilen möchten, können Sie natürlich auch einen neuen postgres-Container im Stack definieren.

# 1. Datenbank-User erstellen
docker exec -it paperless-db psql -U paperless -d postgres -c "CREATE USER roundcube WITH PASSWORD 'DeinSicheresPasswort';"

# 2. Datenbank erstellen und User zuweisen
docker exec -it paperless-db psql -U paperless -d postgres -c "CREATE DATABASE roundcubemail OWNER roundcube;"

🔒 Sicherheitshinweis: Verwenden Sie für die Praxis ein Passwort aus einer Umgebungsvariable oder einem Passwort-Manager. Beispiel: PGPASSWORD='DeinSicheresPasswort' docker exec -it ...

2. Docker-Compose (Der Stack)

Erstellen Sie eine docker-compose.yml-Datei in einem geeigneten Verzeichnis (z.B. /opt/roundcube):

version: '3.8'

services:
  roundcube:
    image: roundcube/roundcubemail:latest
    container_name: roundcube-webmail
    restart: unless-stopped
    environment:
      # Mail-Server Einstellungen (am Beispiel von IONOS)
      - ROUNDCUBEMAIL_DEFAULT_HOST=ssl://imap.ionos.de:993
      - ROUNDCUBEMAIL_SMTP_SERVER=tls://smtp.ionos.de:587
      
      # Datenbank-Verbindung (PostgreSQL)
      - ROUNDCUBEMAIL_DB_TYPE=pgsql
      - ROUNDCUBEMAIL_DB_HOST=paperless-db        # Name des DB-Containers
      - ROUNDCUBEMAIL_DB_USER=roundcube
      - ROUNDCUBEMAIL_DB_PASSWORD=DeinSicheresPasswort  # !!! Durch sicheres Secret ersetzen !!!
      - ROUNDCUBEMAIL_DB_NAME=roundcubemail
      
      # Weitere Umgebungsvariablen
      - ROUNDCUBEMAIL_SMTP_PORT=587
      - ROUNDCUBEMAIL_SMTP_USER=%u                # Nutzt den Login-Namen des Users
      - ROUNDCUBEMAIL_SMTP_PASS=%p                # Nutzt das Passwort des Users
      
    volumes:
      - ./config:/var/roundcube/config           # Konfigurationsdateien
      - ./logs:/var/roundcube/logs               # Logs (optional)
      - ./temp:/var/roundcube/temp               # Temporäre Dateien
      
    networks:
      - database-net    # Muss mit dem Netzwerk der PostgreSQL-DB übereinstimmen
      - proxy-net       # Muss mit dem Netzwerk des Reverse Proxys übereinstimmen

networks:
  database-net:
    external: true
    name: paperless_paperless-internal  # Exakter Name des existierenden Netzwerks
  proxy-net:
    external: true
    name: nginx-proxy-manager-net       # Exakter Name des Proxy-Netzwerks

Starten Sie den Container:

docker-compose up -d

💡 Tipp: Überprüfen Sie die Logs mit docker-compose logs -f roundcube, um eventuelle Fehler frühzeitig zu erkennen.

3. Die „Anti-Blank-Page“ Konfiguration

Damit Roundcube in einem Iframe innerhalb von Nextcloud geladen werden darf, müssen wir die Sicherheits-Header anpassen. Erstellen Sie die Datei ./config/config.inc.php:

<?php
// ============================================
// ROUNDCUBE KONFIGURATION für Nextcloud-Integration
// ============================================

// Datenbank-Verbindung
$config['db_dsnw'] = 'pgsql://roundcube:DeinSicheresPasswort@paperless-db/roundcubemail';

// ============================================
// IFRAME & SECURITY SETTINGS (Nextcloud-Integration)
// ============================================

// 1. Erlaube deiner Nextcloud-Domain das Einbetten
$config['frame_ancestors'] = array(
    'https://team.pro-vesta.de',      // Ihre Nextcloud-URL
    'https://webmail.pro-vesta.de'    // Ihre Roundcube-URL
);

// 2. Deaktiviere restriktive Header (wichtig für Iframes!)
$config['x_frame_options'] = false;

// 3. Cookie-Handling für Browser (Chrome/Safari) optimieren
$config['session_samesite'] = 'None';  // Erforderlich für Cross-Origin Iframes
$config['use_https'] = true;           // Cookies nur über HTTPS senden

// 4. Redirect-Schutz deaktivieren (verhindert weiße Seite beim Login)
$config['login_browser_check'] = false;
$config['standard_windows'] = true;

// ============================================
// MAIL-SERVER KONFIGURATION (SSL/TLS)
// ============================================

$config['imap_conn_options'] = array(
    'ssl' => array(
        'verify_peer' => false,        // ⚠️ Nur für Test/self-signed!
        'verify_peer_name' => false,   // ⚠️ In Produktion mit gültigem Zertifikat ändern!
        'allow_self_signed' => true    // ⚠️ Nur für Testumgebungen!
    ),
);

$config['smtp_conn_options'] = array(
    'ssl' => array(
        'verify_peer' => false,
        'verify_peer_name' => false,
        'allow_self_signed' => true
    ),
);

// ============================================
// WEITERE EMPFOHLENE EINSTELLUNGEN
// ============================================

// Sprache
$config['language'] = 'de_DE';

// Themes (falls gewünscht)
$config['skin'] = 'elastic';

// Logging (für Debugging)
$config['log_driver'] = 'file';
$config['log_date_format'] = 'Y-m-d H:i:s';
$config['debug_level'] = 1;  // 1=Errors, 4=Debug
?>

⚠️ Kritischer Sicherheitshinweis: Die Deaktivierung der SSL-Verifizierung (verify_peer => false) ist nur für Testumgebungen oder selbst-signierte Zertifikate geeignet. In Produktivumgebungen sollten Sie ein gültiges Zertifikat auf Ihrem Mailserver verwenden und diese Einstellungen entfernen!

Nach Änderungen den Container neustarten:

docker-compose restart roundcube

4. Reverse Proxy (Nginx Proxy Manager)

Melden Sie sich in Ihrem Nginx Proxy Manager an
Erstellen Sie einen neuen Proxy Host
Tragen Sie ein:
- Domain Names: webmail.ihre-domain.de
- Forward Hostname/IP: roundcube (oder die IP Ihres Docker-Hosts)
- Forward Port: 80
- SSL: Certbot-Zertifikat aktivieren
Unter Advanced (Erweiterte Einstellungen) fügen Sie diese Zeilen hinzu:

# Sicherheitsheader für Iframe-Integration anpassen
proxy_hide_header X-Frame-Options;
proxy_hide_header Content-Security-Policy;

# Eigene CSP für Nextcloud-Integration
add_header Content-Security-Policy "frame-ancestors https://team.pro-vesta.de https://webmail.pro-vesta.de;";

Speichern und testen Sie den Zugriff auf https://webmail.ihre-domain.de

5. Nextcloud-Integration (External Sites)

Anstatt instabiler Wrapper-Apps nutzen wir die offizielle Lösung:

App installieren:
- Gehen Sie in Nextcloud zu Apps → Kategorie “Integration”
- Suchen und installieren Sie die App “External Sites” (Externe Seiten)
Externe Seite konfigurieren:
- Gehen Sie zu Einstellungen → Administration → Zusatzfunktionen → Externe Seiten
- Klicken Sie auf das Plus-Icon (Neue externe Seite hinzufügen)
- Tragen Sie folgende Werte ein:
  - Name: Webmail (oder beliebiger Anzeigename)
  - URL: https://webmail.ihre-domain.de
  - Icon: Optional ein Mail-Symbol auswählen
  - Position: “In der Kopfzeile” (empfohlen)
- Wichtig: Aktivieren Sie die Option “In einem Iframe öffnen”
- Klicken Sie auf “Hinzufügen”
Testen:
- Die neue Schaltfläche “Webmail” sollte jetzt in der Nextcloud-Kopfzeile erscheinen
- Beim Klick sollte Roundcube nahtlos im Dashboard geladen werden

✅ Schnelltest-Checkliste

Nach der Einrichtung sollten Sie diese Punkte überprüfen:

Direkter Zugriff: Roundcube unter https://webmail.ihre-domain.de direkt aufrufbar? (Keine Cookie-/SSL-Fehler?)
Iframe-Test: Lädt die Seite im Nextcloud-Dashboard-Iframe ohne weißen Bildschirm?
Login-Funktion: Können Sie sich mit Ihren Mail-Account-Daten einloggen?
IMAP/SMTP: Funktionieren sowohl E-Mail-Abruf als auch Versand?
Responsive Design: Sieht Roundcube im Iframe auf Mobilgeräten gut aus?

🐛 Häufige Probleme & Lösungen

Problem 1: Weiße Seite / Iframe wird blockiert

Lösung: Prüfen Sie folgende Einstellungen:

frame_ancestors in Roundcube enthält exakt Ihre Nextcloud-URL (mit https://)
x_frame_options ist auf false gesetzt
Nginx Proxy Manager sendet keine konfligierenden Header

Problem 2: “NETWORK_ERROR” in Nextcloud

Lösung:

Roundcube muss über HTTPS erreichbar sein (nicht HTTP)
use_https => true und session_samesite => 'None' sind essenziell
Cookies müssen über Cross-Origin gesendet werden dürfen

Problem 3: Datenbank-Verbindungsfehler

Lösung:

Docker-Netzwerk-Konfiguration prüfen: Läuft Roundcube im selben Netzwerk wie die DB?
DB-User-Berechtigungen überprüfen: GRANT ALL PRIVILEGES ON DATABASE roundcubemail TO roundcube;
Firewall-Einstellungen prüfen

Problem 4: Login führt zu Blank Page

Lösung:

login_browser_check muss false sein
standard_windows sollte true sein
Browser-Cookies für die Domain zulassen

🏆 Warum diese Lösung?

Vorteile im Überblick:

Vorteil	Erklärung
⚡ Stabilität	Keine JavaScript-Interaktion zwischen Subdomains → Keine Cross-Origin Security Errors
🔒 Sicherheit	frame_ancestors verhindert Einbettung auf fremden, böswilligen Seiten
🚀 Performance	Roundcube läuft als eigenständiger Dienst → Belastet Nextcloud-PHP-Prozesse nicht
🔄 Unabhängigkeit	Updates können einzeln durchgeführt werden, keine Abhängigkeiten
🎨 Native UX	Vollständiges Roundcube-Feature-Set, vertraute Oberfläche

Nachteile / Limitationen:

Keine Deep Integration: Roundcube läuft isoliert, teilt z.B. keine Nextcloud-Kontakte
Zwei Logins: Mail-Login separat von Nextcloud-Login (kann aber mit SSO-Lösungen umgangen werden)
Iframe-Beschränkungen: Manche Browser-Plugins blockieren Iframes (z.B. strenge Tracking-Blocker)

🚀 Fortgeschrittene Optimierungen

1. Single Sign-On (SSO) einrichten

Falls gewünscht, können Sie Roundcube mit Ihrer Nextcloud-Authentifizierung koppeln:

Nutzen Sie die Roundcube-App “sso” oder “oauth2”
Konfigurieren Sie Nextcloud als OAuth2-Provider
Erfordert zusätzliche Konfiguration, ermöglicht aber einmaligen Login

2. Themes an Nextcloud anpassen

Roundcube kann visuell an Nextcloud angeglichen werden:

Roundcube-Theme “elastic” ist responsiv und anpassbar
CSS-Anpassungen über ./config/skins/elastic/custom.css
Farbpalette an Nextcloud-Farben angleichen

3. Sicherheit optimieren

Für Produktivumgebungen:

SSL-Verifizierung für IMAP/SMTP aktivieren (verify_peer => true)
Regelmäßige Backups der PostgreSQL-Datenbank
Fail2ban für Roundcube-Login-Schutz einrichten
Subdomain mit HSTS und strengen Sicherheitsheadern schützen

📚 Fazit

Die Integration von Roundcube in Nextcloud via “External Sites” bietet eine ausgereifte, stabile Lösung für den täglichen Einsatz. Während sie keine tiefe technische Integration bietet, überzeugt sie durch Zuverlässigkeit, Performance und Sicherheit.

Das Wichtigste in Kürze:

✅ Docker-Compose mit bestehender PostgreSQL-DB nutzen
✅ frame_ancestors und x_frame_options korrekt konfigurieren
✅ Reverse Proxy für SSL und Header-Management einsetzen
✅ “External Sites” App für nahtlose Nextcloud-Integration

Mit diesem Setup haben Sie ein professionelles Webmail innerhalb Ihrer Nextcloud-Umgebung – ohne Kompromisse bei Stabilität oder Sicherheit.

Haben Sie Fragen oder benötigen Hilfe? Teilen Sie Ihre Erfahrungen in den Kommentaren oder besuchen Sie unsere Community-Foren.

Letztes Update: März 2024 | Getestet mit Nextcloud 27, Roundcube 1.6, Docker 24

in HowTo

Fritz retten

Hast Du 10 Min Zeit?