Biểu mẫu liên hệ là một yếu tố cần thiết cho các trang web. Nó cho phép khách truy cập giao tiếp với quản trị viên trang bằng cách gửi biểu mẫu. Biểu mẫu yêu cầu liên hệ được sử dụng cho nhiều mục đích, như gửi truy vấn, đề xuất, yêu cầu, v.v. Chức năng biểu mẫu liên hệ có thể được triển khai dễ dàng với PHP. Nói chung, dữ liệu yêu cầu liên hệ được gửi đến quản trị viên qua email. Bạn có thể tạo biểu mẫu liên hệ có chức năng email bằng PHP
Tính năng CAPTCHA rất hữu ích để bảo vệ biểu mẫu khỏi bot. Đảm bảo xác thực CAPTCHA được thêm vào biểu mẫu liên hệ để bảo vệ việc gửi thư rác. Google reCAPTCHA là giải pháp tích hợp CAPTCHA vào form liên hệ hiệu quả nhất. Hướng dẫn này sẽ chỉ cho bạn cách tạo biểu mẫu liên hệ và tích hợp Google reCAPTCHA với PHP
Biểu mẫu liên hệ PHP với quy trình tích hợp Google reCAPTCHA
- Tạo khóa API Google reCAPTCHA
- Tạo biểu mẫu HTML để chấp nhận yêu cầu liên hệ
- Thêm tiện ích hộp kiểm reCAPTCHA vào biểu mẫu liên hệ
- Xác thực dữ liệu biểu mẫu bằng Google reCAPTCHA và PHP
- Gửi dữ liệu biểu mẫu qua email bằng PHP
Tạo khóa API Google reCAPTCHA
Trước khi bắt đầu với Google reCAPTCHA, cần có Khóa trang web và Khóa bí mật để sử dụng API reCAPTCHA. Đăng ký trang web của bạn trên Bảng điều khiển dành cho quản trị viên reCAPTCHA của Google và nhận một trang web cũng như các khóa bí mật. Bạn có thể thực hiện quy trình từng bước để tạo Google reCAPTCHA Site key và Secret key
Tạo biểu mẫu HTML bằng CAPTCHA
Xác định một số phần tử HTML để chấp nhận đầu vào của người dùng. Biểu mẫu HTML sau chứa một số trường nhập [Tên, Email, Chủ đề và Tin nhắn] để gửi yêu cầu liên hệ
Thêm tiện ích Google reCAPTCHA vào biểu mẫu liên hệ
- Bao gồm thư viện JavaScript reCAPTCHA
- Thêm phần tử thẻ
g-recaptcha
để đính kèm tiện ích hộp kiểm reCAPTCHA với biểu mẫu - Chỉ định Khóa trang web của API reCAPTCHA trong thuộc tính
data-sitekey
Sau khi gửi biểu mẫu, dữ liệu yêu cầu liên hệ được đăng lên tập lệnh phía máy chủ [submit.php
] để xử lý. Bao gồm tập lệnh gửi biểu mẫu phía máy chủ ở đầu tệp nơi đặt biểu mẫu liên hệ
// Include form submission script
include_once 'submit.php';
?>
Gửi biểu mẫu liên hệ với Xác minh reCAPTCHA [gửi. php]
Tệp submit.php
này chứa mã phía máy chủ xử lý việc gửi biểu mẫu và xử lý yêu cầu liên hệ
- Truy xuất dữ liệu đầu vào từ các trường biểu mẫu bằng cách sử dụng biến PHP $_POST
- Kiểm tra xem các trường đầu vào đã được điền và không trống
- Xác thực địa chỉ email bằng bộ lọc PHP FILTER_VALIDATE_EMAIL
- Xác thực hộp kiểm reCAPTCHA với tham số
g-recaptcha-response
POST - Xác minh phản hồi reCAPTCHA bằng PHP – Gọi Google reCAPTCHA API với các tham số bí mật và phản hồi
secret
– Chỉ định Khóa bí mậtresponse
– Chỉ định phản hồi của người dùng nhận được từ phản hồi g-recaptcha
- Nếu API reCAPTCHA trả về phản hồi thành công, yêu cầu liên hệ sẽ được coi là hợp lệ và tiếp tục
- Gửi dữ liệu biểu mẫu liên hệ tới quản trị viên qua email bằng hàm PHP mail[]
- Thông báo trạng thái gửi biểu mẫu liên hệ được hiển thị cho người dùng
// Google reCAPTCHA API key configuration
$siteKey = 'Insert_reCaptcha_Site_Key';
$secretKey = 'Insert_reCaptcha_Secret_Key';// Email configuration
$toEmail = 'admin@example.com';
$fromName = 'Sender Name';
$formEmail = 'sender@example.com';$postData = $statusMsg = $valErr = '';
$status = 'error';// If the form is submitted
if[isset[$_POST['submit']]]{
// Get the submitted form data
$postData = $_POST;
$name = trim[$_POST['name']];
$email = trim[$_POST['email']];
$subject = trim[$_POST['subject']];
$message = trim[$_POST['message']];// Validate form fields
if[empty[$name]]{
$valErr .= 'Please enter your name.
';
}
if[empty[$email] || filter_var[$email, FILTER_VALIDATE_EMAIL] === false]{
$valErr .= 'Please enter a valid email.
';
}
if[empty[$subject]]{
$valErr .= 'Please enter subject.
';
}
if[empty[$message]]{
$valErr .= 'Please enter your message.
';
}if[empty[$valErr]]{
// Validate reCAPTCHA box
if[isset[$_POST['g-recaptcha-response']] && !empty[$_POST['g-recaptcha-response']]]{// Verify the reCAPTCHA response
$verifyResponse = file_get_contents['//www.google.com/recaptcha/api/siteverify?secret='.$secretKey.'&response='.$_POST['g-recaptcha-response']];// Decode json data
$responseData = json_decode[$verifyResponse];// If reCAPTCHA response is valid
if[$responseData->success]{// Send email notification to the site admin
$subject = 'New contact request submitted';
$htmlContent = "
Contact Request Details
Name: ".$name."
Email: ".$email."
Subject: ".$subject."
Message: ".$message."
";// Always set content-type when sending HTML email
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
// More headers
$headers .= 'From:'.$fromName.' ' . "\r\n";// Send email
@mail[$toEmail, $subject, $htmlContent, $headers];$status = 'success';
$statusMsg = 'Thank you! Your contact request has submitted successfully, we will get back to you soon.';
$postData = '';
}else{
$statusMsg = 'Robot verification failed, please try again.';
}
}else{
$statusMsg = 'Please check on the reCAPTCHA box.';
}
}else{
$statusMsg = 'Please fill all the mandatory fields:
'.trim[$valErr, '
'];
}
}
// Display status message
echo $statusMsg;
Gửi email có tệp đính kèm khi gửi biểu mẫu bằng PHP
Phần kết luận
Kịch bản ví dụ này xây dựng một biểu mẫu liên hệ đơn giản với CAPTCHA và chức năng email bằng HTML và PHP. Nó giúp tích hợp chức năng biểu mẫu liên hệ vào trang web và bảo vệ khỏi bot và thư rác. Bạn có thể sử dụng tập lệnh biểu mẫu liên hệ PHP này trên bất kỳ trang web nào, kể cả bố cục trang web đáp ứng trên thiết bị di động
Bạn có muốn nhận trợ giúp triển khai hay sửa đổi hoặc nâng cao chức năng của tập lệnh này không?