Users Login and Registration Template

This is a secure login & registration form using PHP, MySQL and jQuery using Bootstrap 3.

Form is using MySQL Prepared Statements and password encryption using SHA-256.

Index.php code :--

<?php
	ob_start();
	session_start();
	require_once 'dbconnect.php';

	if (!isset($_SESSION['user'])) {
	header("Location: login.php");
	exit;
	}
	// select logged in users detail
	$res = $conn->query("SELECT * FROM users WHERE id=" . $_SESSION['user']);
	$userRow = mysqli_fetch_array($res, MYSQLI_ASSOC);

	?>
	<!DOCTYPE html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>Hello,<?php echo $userRow['email']; ?></title>
	<link rel="stylesheet" href="assets/css/bootstrap.min.css" type="text/css"/>
	<link rel="stylesheet" href="assets/css/index.css" type="text/css"/>
	</head>
	<body>

	<!-- Navigation Bar-->
	<nav class="navbar navbar-default navbar-fixed-top">
	<div class="container">
	<div class="navbar-header">
	<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
	aria-expanded="false" aria-controls="navbar">
	<span class="sr-only">Toggle navigation</span>
	<span class="icon-bar"></span>
	<span class="icon-bar"></span>
	<span class="icon-bar"></span>
	</button>
	<a class="navbar-brand" href="#">Website Name</a>
	</div>
	<div id="navbar" class="navbar-collapse collapse">
	<ul class="nav navbar-nav">
	<li class="active"><a href="#">First Link</a></li>
	<li><a href="#">Second Link</a></li>
	<li><a href="#">Third Link</a></li>
	</ul>
	<ul class="nav navbar-nav navbar-right">

	<li class="dropdown">
	<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
	aria-expanded="false">
	<span
	class="glyphicon glyphicon-user"></span> Logged
	in: <?php echo $userRow['email']; ?>
	<span class="caret"></span></a>
	<ul class="dropdown-menu">
	<li><a href="logout.php?logout"><span class="glyphicon glyphicon-log-out"></span> Logout</a>
	</li>
	</ul>
	</li>
	</ul>
	</div>
	</div>
	</nav>




	<div class="container">
	<!-- Jumbotron-->
	<div class="jumbotron">
	<h1>Hello, <?php echo $userRow['username']; ?></h1>
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque at auctor est, in convallis eros. Nulla
	facilisi. Donec ipsum nulla, hendrerit nec mauris vitae, lobortis egestas tortor. </p>
	<p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
	</div>

	<div class="row">
	<div class="col-lg-12">
	<h2>Example body text</h2>
	<p>Nullam quis risus eget <a href="#">urna mollis ornare</a> vel eu leo. Cum sociis natoque penatibus et
	magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>
	<p>
	<small>This line of text is meant to be treated as fine print.</small>
	</p>
	<p>The following snippet of text is <strong>rendered as bold text</strong>.</p>
	<p>The following snippet of text is <em>rendered as italicized text</em>.</p>
	<p>An abbreviation of the word attribute is <abbr title="attribute">attr</abbr>.</p>

	</div>


	</div>
	</div>

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
	<script src="assets/js/bootstrap.min.js"></script>

	</body>
	</html>

dbconnect.php:-

<?php

	$db_host = "mysql";
	$db_name = "db";
	$db_user = "root";
	$db_pass = "pass";


	$conn = new mysqli($db_host, $db_user, $db_pass, $db_name);

	// Check connection
	if ($conn->connect_error) {
	die("Connection failed: " . $conn->connect_error);
	}

<?php
	ob_start();
	session_start();
	require_once 'dbconnect.php';

	// if session is set direct to index
	if (isset($_SESSION['user'])) {
	header("Location: index.php");
	exit;
	}

	if (isset($_POST['btn-login'])) {
	$email = $_POST['email'];
	$upass = $_POST['pass'];

	$password = hash('sha256', $upass); // password hashing using SHA256
	$stmt = $conn->prepare("SELECT id, username, password FROM users WHERE email= ?");
	$stmt->bind_param("s", $email);
	/* execute query */
	$stmt->execute();
	//get result
	$res = $stmt->get_result();
	$stmt->close();

	$row = mysqli_fetch_array($res, MYSQLI_ASSOC);

	$count = $res->num_rows;
	if ($count == 1 && $row['password'] == $password) {
	$_SESSION['user'] = $row['id'];
	header("Location: index.php");
	} elseif ($count == 1) {
	$errMSG = "Bad password";
	} else $errMSG = "User not found";
	}
	?>

	<!DOCTYPE html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>Login</title>
	<link rel="stylesheet" href="assets/css/bootstrap.min.css" type="text/css"/>
	<link rel="stylesheet" href="assets/css/style.css" type="text/css"/>
	</head>
	<body>

	<div class="container">


	<div id="login-form">
	<form method="post" autocomplete="off">

	<div class="col-md-12">

	<div class="form-group">
	<h2 class="">Login:</h2>
	</div>

	<div class="form-group">
	<hr/>
	</div>

	<?php
	if (isset($errMSG)) {

	?>
	<div class="form-group">
	<div class="alert alert-danger">
	<span class="glyphicon glyphicon-info-sign"></span> <?php echo $errMSG; ?>
	</div>
	</div>
	<?php
	}
	?>

	<div class="form-group">
	<div class="input-group">
	<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
	<input type="email" name="email" class="form-control" placeholder="Email" required/>
	</div>
	</div>

	<div class="form-group">
	<div class="input-group">
	<span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
	<input type="password" name="pass" class="form-control" placeholder="Password" required/>
	</div>
	</div>

	<div class="form-group">
	<hr/>
	</div>

	<div class="form-group">
	<button type="submit" class="btn btn-block btn-primary" name="btn-login">Login</button>
	</div>

	<div class="form-group">
	<hr/>
	</div>

	<div class="form-group">
	<a href="register.php" type="button" class="btn btn-block btn-danger"
	name="btn-login">Register</a>
	</div>

	</div>

	</form>
	</div>

	</div>
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
	<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
	</body>
	</html>

logout.php:-

<?php
	session_start();

	if (!isset($_SESSION['user'])) {
	header("Location: login.php");
	} else if (isset($_SESSION['user']) != "") {
	header("Location: home.php");
	}

	if (isset($_GET['logout'])) {
	session_destroy();
	unset($_SESSION['user']);
	header("Location: login.php");
	exit;
	}

<?php
	ob_start();
	session_start();

	if (isset($_SESSION['user']) != "") {
	header("Location: index.php");
	}
	include_once 'dbconnect.php';

	if (isset($_POST['signup'])) {

	$uname = trim($_POST['uname']); // get posted data and remove whitespace
	$email = trim($_POST['email']);
	$upass = trim($_POST['pass']);

	// hash password with SHA256;
	$password = hash('sha256', $upass);

	// check email exist or not
	$stmt = $conn->prepare("SELECT email FROM users WHERE email=?");
	$stmt->bind_param("s", $email);
	$stmt->execute();
	$result = $stmt->get_result();
	$stmt->close();

	$count = $result->num_rows;

	if ($count == 0) { // if email is not found add user


	$stmts = $conn->prepare("INSERT INTO users(username,email,password) VALUES(?, ?, ?)");
	$stmts->bind_param("sss", $uname, $email, $password);
	$res = $stmts->execute();//get result
	$stmts->close();

	$user_id = mysqli_insert_id($conn);
	if ($user_id > 0) {
	$_SESSION['user'] = $user_id; // set session and redirect to index page
	if (isset($_SESSION['user'])) {
	print_r($_SESSION);
	header("Location: index.php");
	exit;
	}

	} else {
	$errTyp = "danger";
	$errMSG = "Something went wrong, try again";
	}

	} else {
	$errTyp = "warning";
	$errMSG = "Email is already used";
	}

	}
	?>
	<!DOCTYPE html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>Registration</title>
	<link rel="stylesheet" href="assets/css/bootstrap.min.css" type="text/css"/>
	<link rel="stylesheet" href="assets/css/style.css" type="text/css"/>
	</head>
	<body>

	<div class="container">

	<div id="login-form">
	<form method="post" autocomplete="off">

	<div class="col-md-12">

	<div class="form-group">
	<h2 class="">Register for our Website</h2>
	</div>

	<div class="form-group">
	<hr/>
	</div>

	<?php
	if (isset($errMSG)) {

	?>
	<div class="form-group">
	<div class="alert alert-<?php echo ($errTyp == "success") ? "success" : $errTyp; ?>">
	<span class="glyphicon glyphicon-info-sign"></span> <?php echo $errMSG; ?>
	</div>
	</div>
	<?php
	}
	?>

	<div class="form-group">
	<div class="input-group">
	<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
	<input type="text" name="uname" class="form-control" placeholder="Enter Username" required/>
	</div>
	</div>

	<div class="form-group">
	<div class="input-group">
	<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
	<input type="email" name="email" class="form-control" placeholder="Enter Email" required/>
	</div>
	</div>

	<div class="form-group">
	<div class="input-group">
	<span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
	<input type="password" name="pass" class="form-control" placeholder="Enter Password"
	required/>
	</div>
	</div>

	<div class="checkbox">
	<label><input type="checkbox" id="TOS" value="This"><a href="#">I agree with
	terms of service</a></label>
	</div>

	<div class="form-group">
	<button type="submit" class="btn btn-block btn-primary" name="signup" id="reg">Register</button>
	</div>

	<div class="form-group">
	<hr/>
	</div>

	<div class="form-group">
	<a href="login.php" type="button" class="btn btn-block btn-success" name="btn-login">Login</a>
	</div>

	</div>

	</form>
	</div>

	</div>
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
	<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="assets/js/tos.js"></script>

	</body>
	</html> DoD.... Download :-https://github.com/laur1s/PHP-Registration-Form/archive/master.zip

Techincalgyan

Search This Blog

Php registration form and login form

Users Login and Registration Template

Comments

Post a Comment