Một vấn đề nhức nhối nhất khi chèn form vào website là bị bot nó auto spam quá. Mail spam từ cf7 suốt ngày luôn. Tức mà không làm gì được thì bài này sẽ giúp bạn chống/chặn luôn auto spam đó nhé
Chuyện là gần đây mình có 1 người inbox hỏi cách chặn spam cho cf7. Thấy bạn đó bảo đã cài akismet, recaptcha, wordfence, format sđt theo Việt Nam mà vẫn bị spam… may mắn cho bạn đó là mình sẵn có code tự làm nên chia sẻ luôn. Ấy vậy mà hiệu quả lắm nhé. Bạn đó bảo không còn thấy spam nữa… mừng quá và chia sẻ luôn cho mọi người cùng thử nha
Nội dung chính:
Để duy trì blog nên mình có làm aff cho 1 số bên hosting. Nhưng dù aff mình cũng chọn 1 số nhà cung cấp uy tín về chất lượng và support nên các bạn cứ yên tâm nhé.
Nếu có mua hosting mà có trong list dưới đây các bạn click vào link trước khi mua để ủng hộ mình nhé. Mình cảm ơn nhiều
- Azdigi: Giá rẻ thì dùng gói Pro Gold Hosting còn chất lượng hơn thì em khuyên dùng Business Hosting. Có điều kiện thì lên VPS nhé
- Tino hosting
- iNet
- Nước ngoài thì Vultr
- Cách 1: Chống spam bằng field ẩn
- Cách 2: Format số điện thoại theo định dạng Việt Nam
- Cách 3: Thêm dạng câu hỏi – trả lời vào form
- Cách 4: Chống spam bằng cách kiểm tra người dùng đã cuộn chuột (scroll) hay chưa
Cách 1: Cách chống spam bằng field ẩn
Nguyên nhân: Đa số spam này là do bot auto spam. Nó cứ chèn đủ các field trong form và submit thôi. Kiểu submit auto luôn ý
Giải pháp: Nên mình nghĩ sao không làm 1 field ẩn. Sau đó check field đó nếu nó được nhập nội dung thì đích thị nó là SPAMER rồi đó 😀 chứ người thường không thể thấy field ẩn đó để điền được 😀
Đến code: mình bắt tay vào code luôn nhé. do code sẵn nên các bạn chỉ cần copy code sau chèn vào wp-content/themes/{your-theme}/functions.php là được
/*
* Chống spam cho contact form 7
* Author: levantoan.com
* */
/*Thêm 1 field ẩn vào form cf7*/
add_filter('wpcf7_form_elements', 'devvn_check_spam_form_cf7');
function devvn_check_spam_form_cf7($html){
$html = '<div style="display: none"><p><span class="wpcf7-form-control-wrap" data-name="devvn"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" value="" type="text" name="devvn"></span></p></div>' . $html;
return $html;
}
/*Kiểm tra form đó mà được nhập giá trị thì là spam*/
add_action('wpcf7_posted_data', 'devvn_check_spam_form_cf7_vaild');
function devvn_check_spam_form_cf7_vaild($posted_data) {
$submission = WPCF7_Submission::get_instance();
if (!empty($posted_data['devvn'])) {
$submission->set_status( 'spam' );
$submission->set_response( 'You are Spamer' );
}
unset($posted_data['devvn']);
return $posted_data;
}
Giải thích một chút thì code trên sẽ thêm 1 field ẩn có name = devvn vào các form cf7 của bạn. Nếu field đó được nhập thì => spamer. Code được chia sẻ trên levantoan.com và nếu okie thì nhớ chia sẻ rộng rãi nha
Cách 2: Format số điện thoại theo định dạng Việt Nam
Với cách 1 phù hợp với tất cả các form và đặc biệt form dạng đăng ký email hoặc chỉ có 1 field đơn giản nào đó sẽ không ảnh hưởng tới thao tác người dùng. Và nếu cách 1 chưa chặn được spam cho form của bạn thì bạn có thể xem thêm cách 2 này nhé
Trong cách này mình sẽ format cho chuẩn số điện thoại theo Việt Nam là: số 0 đằng trước và có 9-10 số ở đằng sau số 0 nhé
Tất nhiên cách này chỉ phù hợp với 1 số trường hợp nhất định và bạn phải chú ý khi dùng
Ví dụ form của bạn ô số điện thoại như sau:
Thì code chèn vào wp-content/themes/{your-theme}/functions.php sẽ như sau
/*
* Chống spam cho contact form 7 bằng định dạng số điện thoại
* Author: levantoan.com
* */
add_filter('wpcf7_validate_tel', 'devvn_custom_validate_sdt', 10, 2);
add_filter('wpcf7_validate_tel*', 'devvn_custom_validate_sdt', 10, 2);
function devvn_custom_validate_sdt($result, $tag) {
$name = $tag->name;
if ($name === 'your-tel') {
$sdt = isset($_POST[$name]) ? wp_unslash($_POST[$name]) : '';
if (!preg_match('/^0([0-9]{9,10})+$/D', $sdt)) {
$result->invalidate($tag, 'Số điện thoại không hợp lệ.');
}
}
return $result;
}
Trong đoạn code trên bạn chú ý 3 chỗ cần chú ý là :
- wpcf7_validate_tel: chữ tel ở đây là loại field bạn dùng. Ở ví dụ dùng tel nhé. còn bạn dùng text thì nhập là text
- wpcf7_validate_tel*: chữ tel* ở đây là loại field bạn dùng và có bắt buộc.
- your-tel là tên field nhé. Đổi thành tên field của bạn cho đúng
Cách 3: Thêm dạng câu hỏi – trả lời vào form
Nếu qua 2 cách trên mà bạn vẫn bị spam thì.. cách này chắc chắn sẽ triệt để luôn nè nhưng nó cũng hơi phiền cho người dùng nhé 😀
Giải pháp: thêm 1 danh sách câu hỏi đơn giản để khi khách điền form sẽ nhập câu trả lời vào đó. Nếu đúng thì mới cho submit form. Tất nhiên là thêm vài câu đơn giản hết mức có thể thôi. Dạng như 1 + một bằng mấy? hoặc 2 + một bằng mấy? thế thì bố bot cũng không biết đâu 😀
Cách làm: cái này thì không cần code thêm mà dùng luôn field quiz của cf7 nhé. Trong ví dụ mình thêm 3 câu hỏi thôi. Bạn có thể thêm câu hỏi khác và nhiều hơn nữa nha
Sửa form mà bạn muốn chống spam => đặt chuột vào vị trí muốn hiển thị field trong form của bạn => ấn vào Câu hỏi như hình dưới
Bên ngoài sẽ hiển thị như sau:
Ưu điểm:
- Chắc chắn chống spam triệt để luôn
Hạn chế:
- Gây khó cho người dùng khó tính 😀
- Form phải thêm 1 field
Cách 4: Chống spam bằng cách kiểm tra người dùng đã cuộn chuột (scroll) hay chưa
Cách này mình nghĩ là cách đơn giản và hiểu quả nhất. Vừa đơn giản cho người dùng vừa hạn chế được auto spam
Cơ chế: Form thì đa số để ở giữa hoặc cuối web, nên người dùng kiểu gì cũng phải cuộn chuột thì mới tới được form và nhập thông tin > sau đó mới submit đúng không? Vì vậy mình sẽ tính toán số con số mà khách đã cuộn và nếu cuộn tới mức mà mình thấy okie thì sẽ cho submit
Ưu điểm:
- Không gây khó chịu cho người dùng. Giống cách 1
- Đơn giản ko ảnh hưởng tới giao diện form
Nhược điểm:
- Hiện tại chưa nghĩ ra nhược điểm nào 😀
Cách thực hiện:
Thêm code sau vào wp-content/themes/{your-theme}/functions.php là được nhé
/*
* Check spam cf7 bằng scroll
* Author: levantoan.com
* */
add_filter('wpcf7_form_elements', 'devvn_check_scroll_form_cf7');
function devvn_check_scroll_form_cf7($html){
$html = '<div style="display: none"><p><span class="wpcf7-form-control-wrap" data-name="devvn-scroll"><input size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" value="0" type="text" name="devvn-scroll"></span></p></div>' . $html;
return $html;
}
add_action('wpcf7_posted_data', 'devvn_check_scroll_form_cf7_vaild');
function devvn_check_scroll_form_cf7_vaild($posted_data) {
$submission = WPCF7_Submission::get_instance();
$scroll = isset($posted_data['devvn-scroll']) ? intval($posted_data['devvn-scroll']) : 0;
//nếu form ở ngay trên đầu page thì thay 5000 thành số nhỏ hơn. ví dụ 200
if (!$scroll || $scroll <= 5000) {
$submission->set_status( 'spam' );
$submission->set_response( 'You are spamer' );
}
unset($posted_data['devvn-scroll']);
return $posted_data;
}
add_action('wp_footer', function (){
?>
<script>
const scrollInputs = document.querySelectorAll('input[name="devvn-scroll"]');
if(scrollInputs.length > 0) {
let accumulatedScroll = 0;
function devvnCheckScroll() {
accumulatedScroll += window.scrollY;
scrollInputs.forEach(input => {
input.value = accumulatedScroll;
});
//nếu form ở ngay trên đầu page thì thay 6000 thành số nhỏ hơn. ví dụ 300
if (accumulatedScroll >= 6000) {
window.removeEventListener('scroll', devvnCheckScroll);
}
}
window.addEventListener('scroll', devvnCheckScroll);
}
</script>
<?php
});
Trong code có 2 số là 5000 và 6000 như mình cũng đã note trực tiếp ở code. Con số này tuỳ thuộc vào form ở vị trí nào trên web nhưng theo mình để số đó là okie rồi nhé. Bạn có thể đổi theo ý nha
Kết luận:
Vậy thôi trên đây là những cách chống spam mà mình muốn chia sẻ với các bạn. Chúc các bạn chặn được mấy cái bot spam khó chịu đó nha.
Keyword:
- How to Stop Contact Form Spam in WordPress
- chống spam cho contact form 7
- chặn spam cho contact form 7
- Bình luận
