Implementing Captcha for a Login Page in CodeIgniter

Introduction:
Captcha (Completely Automated Public Turing test to tell Computers and Humans Apart) is a security mechanism used to prevent automated bots from accessing web applications. In this article, we will discuss how to implement a Captcha at the login page of a web application built using the CodeIgniter framework. Captcha ensures that only humans can log in, enhancing security against brute force attacks.

CodeIgniter is a popular PHP framework that simplifies web application development. We will guide you through the steps to add Captcha to the login page of a CodeIgniter application. We will use PHP’s built-in GD library to create and render Captcha images.
Implementing Captcha in CodeIgniter:

Login Page Form:
In your login page, create an HTML form for user login. Include fields for username, password, and the Captcha image. Ensure that the form’s “action” attribute points to the relevant controller method for login.

Generating a Captcha:
In your CodeIgniter controller, create a function that generates a random string and stores it in the session. This string will be used to create the Captcha image.

function random_strings($length_of_string) {
// String of all alphanumeric characters
$str_result = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ';
// Shuffle the string and return a substring of the specified length
return substr(str_shuffle($str_result), 0, $length_of_string);
}

function createCaptcha() {
$rn = $this->random_strings(6);
$this->session->set_userdata('captcha', $rn);
$this->createTextImage($rn);
}

Creating the Captcha Image: Implement a function in your controller to create a Captcha image based on the random string generated. This function will use the GD library to generate the image. The function creates an image with the random text and sends it as a response.

function createTextImage($text) {
// Set font size
$font_size = 8;


// Calculate image width and height
$txt = explode("n", $text);
$width = 0;
foreach ($txt as $k => $string) {
    $width = max($width, strlen($string));
}

$width = imagefontwidth($font_size) * $width;
$height = imagefontheight($font_size) * count($txt);
$fontheight = imagefontheight($font_size);
$fontwidth = imagefontwidth($font_size);

// Create the image
$img = imagecreatetruecolor($width, $height);

// Set background color
$bg = imagecolorallocate($img, 255, 255, 255);
imagefilledrectangle($img, 0, 0, $width, $height, $bg);

// Set font color
$color = imagecolorallocate($img, 0, 0, 0);


// Render the text on the image
foreach ($txt as $k => $string) {
    $length = strlen($string);
    $ypos = 0;

    for ($i = 0; $i < $length; $i++) {
        $xpos = $i * $fontwidth;
        $ypos = $k * $fontheight;
        imagechar($img, $font_size, $xpos, $ypos, $string, $color);
        $string = substr($string, 1);
    }
}


// Return the image
header("Content-Type: image/png");
imagepng($img);
imagedestroy($img);

}

Displaying the Captcha: In your login page’s HTML form, include an image tag that points to the “createCaptcha” method in your CodeIgniter controller. This tag will display the Captcha image to the user.

<img src="<?php echo site_url('Ci_controller_name/createCaptcha'); ?>" id='captcha_image' style="height:22px;">

Conclusion: By following these steps, you can add a Captcha to the login page of your CodeIgniter application, making it more secure against automated attacks. Users will be required to enter the correct security code from the Captcha image to log in, ensuring that only humans gain access to the system. This additional layer of security helps protect your application from unauthorized access and malicious login attempts.

Thanks,
DgiHost.com