Jak vytvořit moderní kontaktní formulář bez nastavení SMTP nebo e-mailového serveru
Komplexní technická příručka o oddělení webových formulářů od křehkých serverů SMTP, zlepšení doručitelnosti na 99,8 % a odstranění přihlašovacích údajů pro e-maily ve formě čistého textu z webové infrastruktury.
1. Proč tradiční SMTP selhává na moderních webových stránkách
Po celá desetiletí vývojáři konfigurovali přihlašovací údaje PHPMailer nebo SMTP přímo v kódu svých webových stránek nebo v databázích CMS. V bezserverových, statických (Jamstack) a okrajových počítačových prostředích to vytváří vážné architektonické chyby: odhalené přihlašovací údaje v klientských balíčcích, časové limity připojení a selhání dodání SPF/DKIM/DMARC.
Nikdy nevkládejte hesla SMTP nebo tajné klíče do balíčků HTML na straně klienta nebo frontendu JavaScript. Použijte vyhrazené koncové body příjmu HTTP.
2. Architektura zpracování oddělených formulářů
Namísto toho, aby se webové servery synchronně připojovaly k portům SMTP během požadavku HTTP, moderní architektury používají oddělený transakční tok. Klient odešle standardní datovou část HTTPS POST do koncového bodu API. Backend ověřuje a atomicky přetrvává dotaz do PostgreSQL, než asynchronní pracovníci odešlou upozornění.
<!-- Vanilla HTML Form with Lugatu Form Endpoint -->
<form id="inquiry-form">
<label for="name">Your Name</label>
<input type="text" id="name" name="name" required />
<label for="email">Work Email</label>
<input type="email" id="email" name="email" required />
<label for="message">Project Details</label>
<textarea id="message" name="message" rows="4" required></textarea>
<!-- Built-in Honeypot Bot Trap -->
<input type="text" name="_gotcha" style="display:none !important" tabindex="-1" autocomplete="off" />
<button type="submit">Send Inquiry</button>
</form>
<script>
document.getElementById('inquiry-form').addEventListener('submit', async (e) => {
e.preventDefault();
const form = e.target;
const data = new FormData(form);
const payload = {
fields: {
name: data.get('name'),
email: data.get('email'),
message: data.get('message')
},
honeypot: data.get('_gotcha') || ''
};
const res = await fetch('https://www.lugatu.com/api/v1/public/forms/YOUR_PUBLIC_FORM_ID/submissions', {
method: 'POST',
headers: { 'Content-Type': 'application/json', 'Accept': 'application/json' },
body: JSON.stringify(payload)
});
if (res.ok) {
alert('Inquiry sent successfully!');
form.reset();
}
});
</script>3. Vestavěná ochrana proti spamu bez rušivých obrázků CAPTCHA
Lugatu kontroluje příchozí příspěvky na automatizované roboty pomocí neviditelných honeypotů a omezení rychlosti. Legitimní návštěvníci odesílají formuláře hladce, aniž by museli řešit hádanky s rozpoznáváním obrázků.
4. Flexibilní režimy oznámení a trvanlivé uchování
I když jsou dosaženy kvóty pro odchozí e-maily, všechny odeslané položky zůstanou zachovány ve vaší doručené poště pracovního prostoru. Můžete si vybrat Okamžitá upozornění, Denní přehledy nebo Týdenní souhrny pro každý formulář.
Neměnné zabezpečení a ověřování
Bezpečnostní pokyny: Nikdy neukládejte hesla serverů SMTP třetích stran na frontend webových serverech. Směrování přes HTTPS POST do autorizovaného koncového bodu příjmu eliminuje vektory krádeže pověření.
Odstraňování problémů a běžné chyby při příjmu
Lugatu ověřuje odchozí transakční e-maily pomocí vysoce uznávaných fondů Amazon SES IP nakonfigurovaných s platným zarovnáním SPF, DKIM a DMARC.
Často kladené otázky
Podporuje Lugatu nahrávání souborů v kontaktních formulářích?
Ano. Lugatu podporuje zabezpečené přílohy prohledané viry pomocí předem podepsaných tokenů pro nahrávání a soukromého úložiště.
Jste připraveni vytvořit koncový bod formuláře?
Začněte zdarma během několika sekund. Není vyžadována žádná kreditní karta.