Contact Form cho website tĩnh
Chiến lược
Nền tảng hoạt động
Kiến trúc có độ sẵn sàng cao (High Availability), có tối thiểu 2 luồng độc lập nhận dữ liệu để tăng khả năng backup để không bao giờ đánh rơi lead khách hàng => Cloudflare Woker truyền về Telegram API + Google Sheet
Chiến lược bảo mật và chống spam:
Vì website tĩnh phơi bày mã nguồn JavaScript (ai nhấn F12 cũng xem được bạn đang gửi dữ liệu đi đâu), bảo mật là nhiệm vụ của Cloudflare Worker. Đây là các lớp rào chắn bạn sẽ thiết lập:
Bạn có thể cấu hình ngay trên Cloudflare (Web Application Firewall – WAF) một quy tắc: Mỗi địa chỉ IP chỉ được phép gửi request đến Worker tối đa 3 lần/phút. Nếu vượt quá, tự động chặn IP đó.
Bảo mật Token bằng Environment Variables (Secrets): * Bạn không bao giờ viết trực tiếp API Key của Telegram hay URL của Google Script vào mã nguồn của website tĩnh, và cũng không viết cứng vào code của Worker.
Bạn sẽ lưu chúng dưới dạng biến môi trường (Secrets) mã hóa bên trong dashboard của Cloudflare. Chỉ có Worker lúc chạy mới đọc được các biến này. Trình duyệt của người dùng hoàn toàn mù tịt.
Khóa mục tiêu bằng CORS (Cross-Origin Resource Sharing):
Worker của bạn sẽ được thiết lập để chỉ chấp nhận dữ liệu gửi đến từ chính xác tên miền website của bạn (ví dụ: https://domaincuaban.com).
Nếu một đối thủ copy mã HTML form của bạn, mang về website của họ và bấm gửi, Worker sẽ thẳng tay từ chối ngay lập tức (trả về lỗi 403 Forbidden).
Xác thực Turnstile cấp độ Server (Server-side Validation):
Đây là bước quan trọng nhất. Nếu chỉ gắn Turnstile lên HTML cho có, bot vẫn có thể qua mặt bằng cách giả lập request gửi thẳng đến Worker.
Worker của bạn phải nhận cái Turnstile Token từ form, sau đó Worker tự mình gọi một cuộc gọi bí mật đến máy chủ của Cloudflare để hỏi: “Token này có hợp lệ không? Có đúng là do người thật vừa tạo ra cách đây vài giây không?”. Nếu Cloudflare xác nhận “OK”, Worker mới chạy tiếp luồng gửi Telegram/Google Sheet.
Rate Limiting (Chống Spam):
Bạn có thể cấu hình ngay trên Cloudflare (Web Application Firewall – WAF) một quy tắc: Mỗi địa chỉ IP chỉ được phép gửi request đến Worker tối đa 3 lần/phút. Nếu vượt quá, tự động chặn IP đó.
QUy trình hoạt động
- Bước 1 & 2: Khách hàng điền form trên website tĩnh
- Giao diện form của bạn chỉ đơn thuần là HTML và JavaScript. Không có bất kỳ kết nối cơ sở dữ liệu nào trực tiếp từ đây.
- Bước 3: Xác thực Bot với Cloudflare Turnstile (Trải nghiệm mượt mà)
- Chiến lược tối ưu: Cloudflare Turnstile có cung cấp chế độ Invisible (Ẩn hoàn toàn).
- Hoạt động: Thay vì bắt khách hàng click vào ô “I am human” hay chọn hình ảnh giao thông rườm rà, Turnstile sẽ chạy ngầm ngay khi trang load. Nó tự động phân tích hành vi chuột, thông tin trình duyệt và môi trường mạng để đánh giá. Khách hàng bấm Submit là đi thẳng luôn, không hề biết có lớp bảo mật đang hoạt động. Trải nghiệm người dùng (UX) được giữ ở mức hoàn hảo.
- Bước 4: Cloudflare Worker tiếp nhận và xử lý song song
- Khi khách bấm Submit, mã JavaScript trên web sẽ đóng gói dữ liệu (Tên, SĐT, Email…) kèm theo một Turnstile Token (được sinh ra ngầm) và gửi một lệnh POST (fetch) đến địa chỉ của Cloudflare Worker.
- Xử lý 2 luồng: Tại Worker, thay vì dùng Promise.all (nếu 1 bên lỗi sẽ từ chối toàn bộ), tôi khuyên bạn nên dùng Promise.allSettled. Cấu trúc này ra lệnh cho Worker bắn dữ liệu đi Telegram và Google Sheet cùng một phần nghìn giây. Nếu Telegram API đang bị bảo trì, dữ liệu vẫn bay vào Google Sheet an toàn (và ngược lại).
sadasg