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: https://mangbinhdinh.vn/demo/?page=javascript-basic-captcha

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://anhkiet.biz
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 cho Hura Apps - một startup nhỏ về công nghệ 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

Binance Launchpad có dễ… húp như bạn tưởng

Tiền kỹ thuật số (cryptocurrency) đang dần mở rộng. Kể ra mình biết khái niệm này từ rất lâu. Nếu các bạn là độc...

10 Công Cụ Có Thể Thay Thế ChatGPT

ChatGPT là một mô hình ngôn ngữ lớn được phát triển bởi OpenAI. Nó cung cấp các câu trả lời nhanh chóng và ngắn...

Hướng Dẫn Đăng Ký Nhận Mã Giảm Giá Highland Coffee

Highland Coffee đang có nhiều chương trình khuyến mã cho khách hàng của mình. Các khuyến mãi có thể bao gồm upsize, mua 1...

Quà cuối năm 2022 từ Shopify

Năm nay nhận quà từ các đối tác công nghệ hơi bị nhiều. Mới đây mình lại nhận được quà từ Shopify. Quà về đúng...

Nhận quà từ đối tác công nghệ Recharge

Recharge là một trong những công ty chuyên cung cấp giải pháp bán hàng đăng ký định kỳ (subscription payments) cho các nền tảng...

BẠN XEM CHƯA

Tạo dịch vụ rút gọn link thông qua TinyURL

Dịch vụ thu gọn link TinyURL chắc hẳn không còn xa lạ với các bạn. Nay mình xin hướng dẫn các bạn cách viết...

Chuyện mưa

Tháng Giêng lún phún mưa phùn Quấn chân lữ khách bâng khuâng đất trời Hoa xuân nghiêng dáng mỉm cười Thẹn thùng má thắm bồi hồi tim...

Youtube gặp sự cố ngày 17/10/2018

Thời điểm hiện tại khi truy cập vào trang chủ của Youtube tại địa chỉ www.youtube.com người dùng chỉ sẽ nhận được khung trang web...

So sánh vui về phụ nữ

Sự giống nhau và khác nhau của phụ nữ và một con sông 1. Sông đôi khi không biết đâu là bờ. Phụ nữ cũng...

Đúng và Sai

Hồi con đi học có vài môn thi... rớt. Ngẫm lại bài làm thế này: "Kể ra mình làm cũng có ý... gần gần...