4. Ihre Website erlauben

Ihr Formular enthält Ihren öffentlichen Schlüssel. Das ist in Ordnung – er ist dafür gedacht, öffentlich zu sein –, aber jeder kann ihn aus dem Quelltext Ihrer Seite kopieren. Zwei Dinge sorgen dafür, dass er nur mit Ihrem Formular funktioniert: die Liste der erlaubten Websites und das CAPTCHA in der Vorlage.

Domain hinzufügen

1. Öffnen Sie Sicherheit. Die Karte Erlaubte Websites listet die Domains auf, die mit Ihrem öffentlichen Schlüssel senden dürfen.

2. Geben Sie Ihre Domain in das Feld Domain hinzufügen ein und klicken Sie auf Hinzufügen. Erlaubte Formate:

   Eintrag	Erlaubt
   example.com	genau example.com
   *.example.com	jede Subdomain, z. B. www.example.com oder shop.example.com – aber nicht example.com selbst
   localhost:3000	einen bestimmten Host mit Port
   localhost	localhost auf jedem Port – praktisch für die lokale Entwicklung

   Die meisten Websites sind mit und ohne www erreichbar, fügen Sie also example.com und *.example.com (oder www.example.com) hinzu.

3. Klicken Sie oben auf der Seite auf Speichern.

Frontmail vergleicht den Origin-Header jeder Browser-Anfrage mit dieser Liste:

• Gar keine Domains – die Karte warnt: Keine Domains eingetragen – jede Website kann Ihren öffentlichen Schlüssel verwenden. Senden funktioniert dann von überall. Für einen ersten Versuch ist das bequem, aber andere können so Ihre Credits aufbrauchen. Gehen Sie so nicht live.
• Eine Domain, die nicht auf der Liste steht – die Anfrage wird mit origin_not_allowed abgelehnt und nichts wird gesendet. Wenn Sie diesen Fehler sehen, prüfen Sie den genauen Host in der Adresszeile (mit oder ohne www, Portnummer).

CAPTCHA aktivieren (empfohlen)

Die erlaubten Websites halten fremde Websites fern, aber keinen Bot, der direkt an die API sendet. Das schafft ein Cloudflare-Turnstile-CAPTCHA – meist als unsichtbare Prüfung, ganz ohne Rätsel. Anfragen ohne gültiges Token scheitern mit captcha_required, bevor sie Sie einen Credit kosten.

Für Websites läuft Turnstile über Ihr eigenes kostenloses Cloudflare-Widget (der kostenlose Cloudflare-Tarif erlaubt nur 10 Hostnamen pro Widget, daher kann Frontmail nicht einen Schlüssel für die Websites aller Kunden verwenden). Die Einrichtung dauert etwa zwei Minuten:

1. Melden Sie sich im Cloudflare-Dashboard an (ein kostenloses Konto genügt), öffnen Sie Turnstile und klicken Sie auf Add widget.

2. Geben Sie dem Widget einen Namen, tragen Sie die Hostnamen Ihrer Website ein – z. B. example.com und www.example.com –, lassen Sie Widget mode auf Managed und klicken Sie auf Create.

3. Kopieren Sie den Site Key und den Secret Key.

4. Zurück in Frontmail fügen Sie auf der Seite Sicherheit beide Schlüssel in die Karte Bot-Schutz (Turnstile) ein und klicken auf Schlüssel speichern. Frontmail prüft den Secret Key bei Cloudflare, speichert ihn verschlüsselt und zeigt ihn nie wieder an.

5. Klicken Sie auf CAPTCHA für alle Vorlagen aktivieren. Die Kontaktvorlage aus diesem Tutorial hat jetzt CAPTCHA verlangen (Turnstile) eingeschaltet (in der Vorlage unter Einstellungen → Schutz); die Vorlage für die automatische Antwort wird übersprungen, weil Frontmail sie sendet und nicht Ihr Formular.

Halten Sie den Site Key bereit – Sie bauen ihn im nächsten Schritt in das Formular ein. Die Framework-Komponenten (FrontmailForm für React, Vue und Svelte) rendern das Widget für Sie. Ab jetzt hat jede neue Vorlage das CAPTCHA standardmäßig aktiviert.

Tipp

Sie probieren nur auf localhost aus? Dann können Sie diesen Abschnitt vorerst überspringen und vor dem Livegang zurückkehren, oder Sie verwenden die Testschlüssel von Cloudflare – aber nie in der Produktion, denn sie lassen jede Anfrage durch.

Achtung

Ein öffentliches Formular ohne CAPTCHA ist ein offenes Tor für Spam-Bots. Richten Sie Turnstile ein, bevor Ihr Formular live geht.

Optionale Extras

Die Karte Schutz vor Missbrauch bietet Headless-Browser blockieren und Strikte Parameter; weiter unten können Sie ein Rate Limit pro IP und eine Blockliste festlegen. Für dieses Tutorial passen die Standardeinstellungen – wenn Sie den Schutz verschärfen möchten, lesen Sie Bot-Schutz und Sicherheitseinstellungen.

Mehr dazu: Erlaubte Domains.