REHBER
Backend Olmadan HTML Form Nasıl Yönetilir
Düz bir HTML form yalnızca markuptan ibarettir. Ziyaretçi gönder butonuna bastığı anda verinin bir yere gitmesi gerekir ve varsayılan olarak bu yer, sizin yazıp barındırdığınız bir sunucudur. Bu rehber, formların neden bir backend gerektirdiğini, sunucu çalıştırmak istemediğinizde gerçekten işe yarayan yöntemleri ve Formstork gibi hosted bir form backend'in bu boşluğu nasıl doldurduğunu anlatır.
Backend yok ne demek
Bir HTML form yalnızca alanları ve bir gönder butonunu tanımlar. Tarayıcı bu veriyi gönderdiğinde formun action özniteliği bir URL'e işaret eder ve karşı tarafta bir bileşenin bu veriyi alıp doğrulayıp saklaması gerekir. Kendi backend'inizi kaldırmak bu adımı ortadan kaldırmaz, yalnızca işi başka bir servisin yapması anlamına gelir.
mailto: ve istemci tarafı hilelerinin yetersizliği
mailto: action'ı yalnızca ziyaretçinin kendi e-posta uygulamasını açar, ancak birçok kişide bu uygulama yapılandırılmamıştır ve hiçbir veri saklanmaz. Saf istemci tarafı JavaScript tek başına e-posta gönderemez veya veri saklayamaz ve tarayıcıya koyduğunuz her API anahtarı herkese açıktır. Gönderimleri güvenilir biçimde toplamak için, siz yazmasanız bile sunucu tarafında bir endpoint'e ihtiyacınız vardır.
İşe yarayan yöntem: action'ı hosted bir endpoint'e yöneltin
Sunucu yazmak yerine formun action'ını hosted bir form backend'e yönlendirir ve formunuzu tanımlayan gizli bir alan eklersiniz. Ziyaretçi normal bir form-encoded veya multipart POST ile gönderir; alma, doğrulama, e-posta gönderme ve saklama işlerini servis üstlenir. Siteniz tamamen statik kalır, böylece GitHub Pages, Netlify veya herhangi bir CDN üzerinde barınabilir.
Seçim yapmadan önce nelere bakmalı
Ziyaretçinin adresi reply-to olarak ayarlanmış, güvenilir bir e-posta teslimatı arayın, böylece doğrudan gelen kutunuzdan yanıt verebilirsiniz. Gönderimlerin yalnızca bir kez iletilmediğini, saklanıp dışarı aktarılabildiğini ve spam korumasının yerleşik olduğunu doğrulayın. Dosya topluyor veya verinin Slack ya da bir tabloya aktarılmasını istiyorsanız, yüklemelerin ve entegrasyonların desteklendiğini kontrol edin.
Formstork bunu nasıl yapar
Formstork ile formunuzu https://api.formstork.com/submit adresine yöneltip gizli bir access_key alanı eklersiniz ya da kısa /f/ACCESS_KEY URL'sini kullanırsınız. Her gönderim, ziyaretçinin adresi reply-to olacak şekilde size e-posta gönderir ve aranabilir, etiketlenebilir bir panele düşer; spam filtreleme, CSV ve JSON dışa aktarma ve Slack, Notion, Google Sheets ile imzalı webhook gibi entegrasyonlar dahildir. Ücretsiz plan ayda 250 gönderimi 90 günlük saklama penceresiyle ve kredi kartı olmadan kapsar; ücretli planlar sonsuz saklama, otomatik yanıtlayıcı ve dosya yüklemeleri ekler.
<form action="https://api.formstork.com/submit" method="POST">
<input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">
<input type="email" name="email" placeholder="Your email" required>
<textarea name="message" placeholder="Your message" required></textarea>
<button type="submit">Send</button>
</form>Sık sorulanlar
HTML form hiçbir backend kodu olmadan çalışır mı?
Evet, form verileri alan hosted bir endpoint'e gönderildiği sürece çalışır. Sayfalarınız statik HTML kalır ve form backend, e-posta gönderimini, saklamayı ve spam korumasını üstlenir. Sunucu kodunu kendiniz hiçbir zaman yazmaz veya deploy etmezsiniz.
Access key'i istemci tarafı HTML'e koymak güvenli mi?
Evet. access_key, bir gönderimin hangi forma ait olduğunu tanımlar; hesap erişimi sağlayan bir sır değildir. Herkese açık HTML içinde yer almak üzere tasarlanmıştır ve endpoint'i bunun yerine spam filtreleme, honeypot ve isteğe bağlı CAPTCHA ile korursunuz.
Bu tür statik bir formu nerede barındırabilirim?
GitHub Pages, Netlify, Vercel, Cloudflare Pages ya da S3 dahil, statik dosya sunan her yerde. Form HTTPS üzerinden Formstork'a gönderim yaptığı için sizin tarafınızda sunucu runtime'ı gerekmez. Ayrıca barındırmayı tamamen atlayıp hosted bir Formstork form sayfası da kullanabilirsiniz.
Formstork'u ücretsiz dene
Tam panelle ayda 250 gönderim. Kredi kartı gerekmez.
Access key'ini alDokümanları oku