Trang chủ Lập trình Javascript - HTML Hướng dẫn tạo captcha đơn giản với JavaScript

Hướng dẫn tạo captcha đơn giản với JavaScript

Mã captcha giúp cho người quản trị loại ngăn chặn phần mềm tự động thực hiện những tác vụ có thể làm giảm đi chất lượng dịch vụ của một hệ thống. Trên các trang web captcha thường được đi kèm với các form đăng ký hay form liên hệ nhằm giảm bớt các đăng ký ảo hoặc liên hệ spam. Nếu có kiến thức về PHP, ASP… bạn có thể dễ dàng tạo ra captcha với nhiều phương thức khác nhau. Bài viết này xin hướng dẫn bạn cách tạo một mã captcha đơn giản với Javascript.

Đoạn mã Javascript này sẽ giúp bạn sinh ra 2 số và thực hiện phép toán cộng và bạn phải thực hiện phép toán cộng này rồi điền kết quả vào khung theo yêu cầu và khi submit thì nếu kết quả đúng thì hành động sẽ được thực hiện còn nếu không thì sẽ thông báo lỗi.

Và đây là đoạn mã cụ thể:

 

Giải thích ý nghĩa:

Đầu tiên ta sẽ tạo 2 biến tên là n1 và n2. 2 biến này nhận giá trị là số bất kỳ được phát sinh tự động từ 1 đến 10. Nếu bạn muốn dãy gia trị chạy nhiều hơn thì thay 10 bằng 100 hay 1000 để tăng lên số có 2 hoặc 3 chữ số. 2 biến này được đặt thành 2 số hạng trong phép tính tổng tại thẻ có id là cau_hoi. Thẻ có id là cau_hoi cùng với thẻ id tra_loi được đặt chung trong form có tên là ten_form. Khi bấm nút thực hiện lệnh thực thi (submit) nó sẽ thự hiện phép toán trong thẻ có id cau_hoi và so sánh giá trị đó với giá trị bạn nhập vào trong thẻ có id là tra_loi. Nếu 2 kết quả này giống nhau thì thao tác tiếp theo sẽ được thực hiện. Nếu khác nhau sẽ có thông báo lỗi hiện lên và thẻ có id là tra_loi sẽ được viền khung đỏ đánh dấu để bạn nhập lại nội dung.

Bạn có thể xem trang web demo tại: http://mangbinhdinh.vn/demo/javascriptcaptcha/

Bạn có thể download mã nguồn tại:

Box.net: http://tinyurl.com/l5qbrx2
Mediafire: http://tinyurl.com/m8y23qu

Lưu ý để đoạn mã này chạy bạn cần sử dụng thư viện JQuery. Ở đây mình dùng phiên bản jQuery v1.10.2. Bạn có thể xem và tải hoặc chèn từ địa chỉ: http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js.

Mở rộng ra bạn có thể tạo mã captcha là một số có n chữ số sinh ngẫu nhiên (lúc tạo biến n1) và thay vì tạo thêm một biến nữa để thực hiện phép toán thì ta có thể yêu cầu nhập lại số vừa sinh ra vào khung trả lời và đối chiếu.

Huỳnh Mai Anh Kiệt

- Advertisement -
Bài trướcTặng quà 8/3
Bài tiếp theoChia tay
Huỳnh Mai Anh Kiệthttps://www.mangbinhdinh.vn
Anh là một người đam mê công nghệ. Hiện tại anh là một lập trình viên tại Quy Nhơn.

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây

BÀI VIẾT MỚI

Cách tùy chỉnh công cụ tìm kiếm trong Firefox

Bạn có thể sử dụng bất kỳ công cụ tìm kiếm nào mà bạn thích trong trình duyệt web của mình. Và bạn cũng...

12 cách khắc phục con trỏ chuột không hiển thị trong Windows 10

Con trỏ chuột đã trở thành một phần không thể thiếu trong quá trình chúng ta tương tác với máy tính. Vì vậy, hãy...

Facebook sập mạng toàn thế giới gần 30 phút trong sáng ngày 09/04/2021

Trong khoảng thời gian từ 4:30 tới 4:55 sáng ngày 09/04/2021, tất cả phương thức truy cập Facebook đều bị tê liệt trên toàn...

Twitter đưa tính năng phòng trò chuyện thoại Spaces lên phiên bản web trên máy tính

Spaces là một tính năng mới của Twitter. Đây là tính năng giúp người dùng Twitter trên iOS và Andoid có thể trò chuyện...

Hướng dẫn từng bước tạo ứng dụng cho Shopify

Ngày nay, Shopify cung cấp cho hơn 1.000.000 doanh nghiệp trên toàn thế giới. Nếu bạn chưa từng sử dụng Shopify nhưng đã quen...

BẠN XEM CHƯA

Kiểm tra giá trị email nhập vào có đúng chuẩn

Có rất nhiều thư viện jQuery hỗ trợ người dùng kiểm tra giá trị các field nhập vào có đúng điều kiện trước khi...

Battlefield 1942

Battlefield 1942 là trò chơi thuộc thể loại bắn súng góc nhìn thứ nhất 3D lấy bối cảnh Thế chiến II do công ty...

Một hành động rất đẹp và xúc động từ cô mua ve chai nghèo

Đây là một câu chuyện có thật diễn ra vào lúc trưa ngày 13/01/2014 tại quán cơm chay Thiên Phước 5000đ,  địa chỉ 62...

Chiếc máy tính bảng đầu tiên của tôi

Bản thân nhận thấy mình là một người rất thích công nghệ và đam mê nó. Tuy nhiên việc bắt nhịp cùng với những...

Miễn phí tải file tốc độ cao trên Fshare, 4share, TaiLieu, TenLua,…

Link Tốc Độ là một dịch vụ trực tuyến cho phép bạn lấy link download VIP tốc độ cao từ các dịch vụ lưu...