In this tutorial we will create a
Simple Login With Captcha using PHP. This code will only login an user account if the given captcha has been solve. The code use
imagettftext() a special tool that create a image data manually and that is where you can store the captcha value as a SESSION data. This is a user-friendly kind of program feel free to modify it.
We will be using
PHP as a scripting language and interpreter that is used primarily on any webserver including xamp, wamp, etc. It is being use to any famous websites and it has a modern technology that can easily be use by the next generation.
Getting Started:
First you have to download & install XAMPP or any local server that run PHP scripts. Here's the link for XAMPP server
https://www.apachefriends.org/index.html.
And, this is the link for the bootstrap that i used for the layout design
https://getbootstrap.com/.
Creating The Interface
This is where we will create a simple form for our application. To create the forms simply copy and write it into your text editor, then save it as
index.php.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<a class="navbar-brand" href="https://sourcecodester.com">Sourcecodester</a>
</div>
</nav>
<div class="col-md-3"></div>
<div class="col-md-6 well">
<h3 class="text-primary">PHP - Simple Login With Captcha</h3>
<hr style="border-top:1px dotted #ccc;"/>
<div class="col-md-3">
<h5>Default user</h5>
<h5>Username: admin</h5>
<h5>Password: admin</h5>
</div>
<div class="col-md-6">
<form action="" method="POST">
<div class="form-group">
<label>Username</label>
<input type="text" name="username" class="form-control" required="required"/>
</div>
<div class="form-group">
<label>Password</label>
<input type="password" name="password" class="form-control" required="required"/>
</div>
<h3>Solve Captcha</h3>
<center><img src="captcha.php" /></center>
<br />
<br />
<div class="form-group">
<input type="text" class="form-control" name="captcha" required="required"/>
</div>
<?php include 'login.php'?>
<center><button name="login" class="btn btn-primary"><span class="glyphicon glyphicon-log-in"></span> login</button></center>
</form>
</div>
</div>
</body>
</html>
Creating the Login Function
This code contains the login function of the application. This code will login a user account if the given captcha is correct. To make this just copy and write these block of codes below inside the text editor, then save it as
login.php
<?php
if(ISSET($_POST['login'])){
$username = $_POST['username'];
$password = $_POST['password'];
$captcha = $_POST['captcha'];
if($username == "admin" && $password == "admin"){
if($_SESSION['captcha'] == $captcha){
echo "<center><label class='text-success'>Login successfully</label></center>";
}else{
echo "<center><label class='text-danger'>Invalid captcha!</label></center>";
}
}else{
echo "<center><label class='text-danger'>Invalid username or password</label></center>";
}
}
?>
Creating the Main Function
This code contains the main function of the application. This code will generate a captcha image when the web page start running. To make this just copy and write these block of codes below inside the text editor, then save it as
captcha.php
<?php
$_SESSION['captcha'] = $random;
?>
There you have it we successfully created
Simple Login With Captcha using PHP. I hope that this simple tutorial help you to what you are looking for. For more updates and tutorials just kindly visit this site. Enjoy Coding!