Login, Signup and Logout now common for any web application. Because without login we can not track the data who uses our application.
For any kind of web application login, signup is the most important thing for security reasons. If we do not have login features in our web application then any one can access our data and services.
Here in this login and signup form example we using 5 files these are:
SQL file: For create table
database.php:For connecting database
register.php: For getting the values from the user
register_a.php: A PHP file that process the signup request
login.php :for getting the values from the user
loginProcess.php : For login process to check valid user or not
home.php : for welcome page after login
logout.php :For logout from the application
Step 1:Create the above table
Step 2: create all other files mentioned above.
Step 3: Create an upload folder for storing the image file.
Sql file
CREATE TABLE `register` ( `ID` int(10) NOT NULL, `First_Name` varchar(100) NOT NULL, `Last_Name` varchar(100) NOT NULL, `Email` varchar(100) NOT NULL, `Password` int(100) NOT NULL, `File` varchar(100) NOT NULL)
database.php
<?php $url='localhost'; $username='root'; $password=''; $conn=mysqli_connect($url,$username,$password,"fregister"); if(!$conn)
{die('Could not Connect My Sql:' .mysql_error()); }?>
register.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,700">
<title>Welcome to Finance Portal</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"><link rel="stylesheet" href="assests/css/style.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script><script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script></head><body><div class="signup-form"> <form action="register_a.php" method="post" enctype="multipart/form-data"><h2>Register</h2><p class="hint-text">Create your account</p> <div class="form-group"><div class="row"><div class="col"><input type="text" class="form-control" name="first_name" placeholder="First Name" required="required"></div><div class="col"><input type="text" class="form-control" name="last_name" placeholder="Last Name" required="required"></div></div> </div> <div class="form-group"> <input type="email" class="form-control" name="email" placeholder="Email" required="required"> </div><div class="form-group"> <input type="password" class="form-control" name="pass" placeholder="Password" required="required"> </div><div class="form-group"> <input type="password" class="form-control" name="cpass" placeholder="Confirm Password" required="required"> </div> <div class="form-group"> <input type="file" name="file" required> <!-- <input type="submit" name="upload" value="Upload" class="btn"> --> </div> <div class="form-group"><label class="form-check-label"><input type="checkbox" required="required"> I accept the <a href="#">Terms of Use</a> & <a href="#">Privacy Policy</a></label></div><div class="form-group"> <button type="submit" name="save" class="btn btn-success btn-lg btn-block">Register Now</button> </div> <div class="text-center">Already have an account? <a href="login.php">Sign in</a></div> </form></div></body></html>
register_a.php
<?phpextract($_POST);include("database.php");$sql=mysqli_query($conn,"SELECT * FROM register where Email='$email'");if(mysqli_num_rows($sql)>0){ echo "Email Id Already Exists"; exit;}else(isset($_POST['save'])){ $file = rand(1000,100000)."-".$_FILES['file']['name']; $file_loc = $_FILES['file']['tmp_name']; $folder="upload/"; $new_file_name = strtolower($file); $final_file=str_replace(' ','-',$new_file_name); if(move_uploaded_file($file_loc,$folder.$final_file)) { $query="INSERT INTO register(First_Name, Last_Name, Email, Password, File ) VALUES ('$first_name', '$last_name', '$email', 'md5($pass)', '$final_file')"; $sql=mysqli_query($conn,$query)or die("Could Not Perform the Query"); header ("Location: login.php?status=success"); } else {echo "Error.Please try again";}}?>
login.php
<?php session_start();?><!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,700"><title>Welcome to Finance Portal</title><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"><link rel="stylesheet" href="assests/css/style.css"><script src="https://code.jquery.com/jquery-3.5.1.min.js"></script><script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script></head><body><div class="signup-form"> <form action="loginProcess.php" method="post" enctype="multipart/form-data"><h2>Login</h2><p class="hint-text">Enter Login Details</p> <div class="form-group"> <input type="email" class="form-control" name="email" placeholder="Email" required="required"> </div><div class="form-group"> <input type="password" class="form-control" name="pass" placeholder="Password" required="required"> </div><div class="form-group"> <button type="submit" name="save" class="btn btn-success btn-lg btn-block">Login</button> </div> <div class="text-center">Don't have an account? <a href="register.php">Register Here</a></div> </form></div></body></html>
loginProcess.php
<?phpsession_start();if(isset($_POST['save'])){ extract($_POST); include 'database.php'; $sql=mysqli_query($conn,"SELECT * FROM register where Email='$email' and Password='md5($pass)'"); $row = mysqli_fetch_array($sql); if(is_array($row)) { $_SESSION["ID"] = $row['ID']; $_SESSION["Email"]=$row['Email']; $_SESSION["First_Name"]=$row['First_Name']; $_SESSION["Last_Name"]=$row['Last_Name']; header("Location: home.php"); } else { echo "Invalid Email ID/Password"; }}?>
home.php
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,700"><title>Welcome to Finance Portal</title><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"><link rel="stylesheet" href="assests/css/style.css"><script src="https://code.jquery.com/jquery-3.5.1.min.js"></script><script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script></head><body><div class="signup-form"> <form action="home.php" method="post" enctype="multipart/form-data"><h2>Welcome</h2> <br> <?phpsession_start();include 'database.php';$ID= $_SESSION["ID"];$sql=mysqli_query($conn,"SELECT * FROM register where ID='$ID' ");$row = mysqli_fetch_array($sql); ?> <img src="upload/<?php echo $row['File'] ?>" height="150" width="150" style="border-radius:50%;display:block;margin-left:auto;margin-right:auto;" /><p class="hint-text"><br><b>Welcome </b><?php echo $_SESSION["First_Name"] ?> <?php echo $_SESSION["Last_Name"] ?></p> <div class="text-center">Want to Leave the Page? <br><a href="logout.php">Logout</a></div> </form></div></body></html>
logout.php
<?php session_start(); unset($_SESSION["id"]); unset($_SESSION["name"]); header("Location:login.php");?>