Sử dụng captcha trong Zend Framework

  • 26/06/2014
  • 1375
  • 0
Captcha là phương pháp hiệu quả nhất trong việc phòng tránh spammer và giúp website được sạch sẽ và gọn gàng. Chúng tôi xin chia sẻ những bước cơ bản để sử dụng captcha đối với những website thiết kế bằng Zend Framework

Spammer luôn là nỗi ám ảnh của những webmaster hay admin diễn đàn. Để phòng chống spammer, người ta đã nghĩ ra việc sử dụng captcha. Captcha là những hình ảnh chứa  các đoạn kí tự ngẫu nhiên mà người dùng cần điền vào ô xác nhận để thực hiện một hành động nào đó như comment, đăng kí tài khoản, post bài. Như vậy, việc sử dụng tools để spam hàng loạt gần như đã biến mất. Hầu hết những website được thiết kế chuyên nghiệp đều áp dụng captcha trong việc quản lý hành vi người dùng. Tuy nhiên, vẫn có nhiều bạn chưa biết cách làm sao để sử dụng captcha trong website, diễn đàn của mình. Chúng tôi xin đưa ra một cách sử dụng captcha đơn giản bằng việc sử dụng Zend_Captcha_Image trong Zend Framework.

captcha 2

Tạo captcha như thế nào?

Để bắt đầu sử dụng captcha, bạn cần chỉ ra đường dẫn tới thư mục chứa ảnh captcha (ảnh trong đó sẽ được tự động tạo), đường dẫn tới font dùng để vẽ và các tùy chọn trong việc vẽ captcha (số kí tự, kích thước, mức độ nhiễu, mờ...). Ví dụ ngay cho các bạn dễ hiểu, phương thức sau sẽ tạo ra và trả về một đối tượng Zend_Captcha_Image có kèm thêm một thuộc tính url trỏ đến đường dẫn captcha để client có thể truy xuất trực tiếp đến đó.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!--?php
public function genCaptcha($controller){
    $captcha = new Zend_Captcha_Image();
    $captcha->setImgDir(APPLICATION_PATH . "/public/images/auth/login/captcha/")
            ->setImgUrl($controller->view->baseUrl("/public/images/auth/login/captcha/"))
            ->setFont(APPLICATION_PATH ."/public/images/auth/login/ARIAL.TTF")
            ->setWordlen(4)
            ->setFontSize(12)
            ->setDotNoiseLevel(2)
            ->setLineNoiseLevel(2)
            ->setWidth(85)
            ->setHeight(30)
            ->generate();
    $captcha->url = $captcha->getImgUrl().$captcha->getId().$captcha->getSuffix();
    return $captcha;
}

Tại view, bạn có thể hiển thị captcha bằng cách dùng phương thức Zend_Captcha_Image->render(Zend_View_Interface $view = null, $element = null);

 

1
<!--?php echo $this->captcha->render($this); ?> 

 

Ngoài ra, vì đã có url đến captcha, bạn có thể tạo thẻ img với html. Như vậy có thể bổ sung các thuộc tính khác cho thẻ dễ dàng.

 

1
<img id="captcha" src="captchaUrl; ?>"/>

 

Cuối cùng, bạn cần lưu lại captchaid để dùng cho việc xác thực captcha. Ta sẽ đặt nó trong một thẻ hidden trong form. Khi post lên server, ta sẽ lấy được giá trị của nó cùng với captcha code:

 

1
<input type="hidden" id="captchaid" name="captchaid" value="captcha->getId() ?>" >

 

Xác thực Captcha

Khi tạo ra một captcha, thông tin của nó sẽ được lưu trong session với key có dạng  Zend_Session_Namespace_{captchaid}”. Ta sẽ lấy ra session này với lớp Zend_Session_Namespace và so sánh captcha code với thuộc tính $session->word.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!--?php
class AuthController extends Zend_Controller_Action
{
    // ...
    public function loginAction()
    {
        Zend_Layout::getMvcInstance()->setLayout('public');
        if ($this->_request->isPost())
        {
            $data = $this->_request->getPost();
            if (isset($_POST['captchaid'])){
                $capId = trim($_POST['captchaid']);
                $capSession = new Zend_Session_Namespace('Zend_Form_Captcha_'.$capId);
                if ($_POST['captchacode'] == $capSession->word)
                {
                    // captcha code is correct
                    // do something else such as checking username, password,...
                    return;
                }else
                    $this->view->msg = "Invalid captcha";
            }
            $this->view->formdata = $data;
        }
        $captcha = AuthController::genCaptcha($this);
        $this->view->captcha = $captcha;
        $this->view->captchaUrl = $captcha->url;
    }
    /**
     *
     * Generate new captcha
     * @param Zend_Controller_Action $controller
     * @var Zend_Captcha_Image
     */
 
    public function genCaptcha($controller){
 
        $module = $this->getRequest()->getModuleName();
        $captcha = new Zend_Captcha_Image();
        $captcha->setImgDir(APPLICATION_PATH . "/public/$module/images/auth/login/captcha/")
                ->setImgUrl($controller->view->baseUrl("/public/$module/images/auth/login/captcha/"))
                ->setFont(APPLICATION_PATH ."/public/$module/images/auth/login/ARIAL.TTF")
                ->setWordlen(4)
                ->setFontSize(12)
                ->setDotNoiseLevel(2)
                ->setLineNoiseLevel(2)
                ->setWidth(85)
                ->setHeight(30)
                ->generate();
        $captcha->url = $captcha->getImgUrl().$captcha->getId().$captcha->getSuffix();
        return $captcha;
    }
}

Chức năng lấy Captcha mới

Ta cần bổ sung thêm một action vào  AuthController để tạo ra captcha mới và trả thông tin về cho trình duyệt. Vì đây là action sử dụng riêng cho ajax, nên ta cần vô hiệu hóa layout và trả về dữ liệu dưới dạng json.

1
2
3
4
5
6
7
8
public function refreshAction(){
 
        $captcha = AuthController::genCaptcha($this);
        $data = array();
        $data["id"]=$captcha->getId();
        $data["url"]=$captcha->url;
        $this->_helper->json($data);
}

Tại view, ta tạo một hàm javascript và dùng ajax gọi đến action trên và thay đổi giá trị của captcha.

1
2
3
4
5
6
7
8
9
10
11
function getCaptcha()
{
    $.ajax({ url: "/admin/auth/refresh",
       type: "POST",
       success: function(data){
            var src = data.url;
            $("#captcha").attr("src",src);
            $("#captchaid").val(data.id);
       }
    });
}

 

Hy vọng là sau bài viết này, bạn đã có đủ kiến thức trong việc sử dụng captcha và phòng chống spammer cũng như tạo ra chất lượng tốt nhất cho website của mình. Trước khi rời đi, bạn có thể ghé qua xem bài viết Thiết kế phong cách cho liên kết bằng CSS để biết thêm một chút về việc trang trí cho website của mình trở nên lộng lẫy và thu hút hơn đối với người dùng

-->

  Ý kiến bạn đọc

Bạn cần trở thành thành viên của nhóm để có thể bình luận bài viết này. Nhấn vào đây để đăng ký làm thành viên nhóm!
Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây