Complete User Login Registration System in PHP with Image upload, In this article we will create both a PHP register and login system where we will also upload images for all the users as part of the user profile.
Here are some major Steps to create a PHP User Login and Registration System with Image upload,
5+ Steps to Create PHP Code For Registration Form with MySQL Database
- Create Database
- Create Database Table with the following fields: name, username, password, city, image, and gender.
- Create a PHP registration functionality
- Create a Login Form
- Connect to the MySQL Database
- Authenticate Logged in User
- Create a Home Page with all User data
Create Database
To create a database, go to PHPMyAdmin and click on SQL Tab. On the SQL tab write below the given query which creates the DB with the given name.
|
1 |
CREATE TABLE `register` |
Create Database Table
Execute the below query which can create the DB table with the listed fields,
|
1 2 3 4 5 6 7 8 9 |
CREATE TABLE `register` ( `name` varchar(20) NOT NULL, `username` varchar(20) NOT NULL, `password` varchar(50) NOT NULL, `city` varchar(15) NOT NULL, `image` varchar(100) NOT NULL, `gender` varchar(10) NOT NULL, `id` int(11) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1; |
Connect to Database
To establish the connection to MySQL DB or PHPMYADMIN we create a file named connect.php where we use mysqli_connect() function.
connect.php
|
1 2 3 4 |
<?php session_start(); $con= mysqli_connect("localhost","DBUSERNAME","DBPASSWORD","DBNAME") ?> |
Create a PHP Registration Form functionality
Here we will create a PHP register script, first, we will create an HTML form with the POST method, also get the user data using the POST method, and insert it into the database with image upload.
register.php
|
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 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 |
<?php include 'connect.php'; if(isset($_POST['sub'])){ $t=$_POST['text']; $u=$_POST['user']; $p=$_POST['pass']; $c=$_POST['city']; $g=$_POST['gen']; //code for image uploading if($_FILES['f1']['name']){ move_uploaded_file($_FILES['f1']['tmp_name'], "image/".$_FILES['f1']['name']); $img="image/".$_FILES['f1']['name']; } $i="insert into register(name,username,password,city,image,gender)values('$t','$u','$p','$c','$img','$g')"; if(mysqli_query($con, $i)){ echo "inserted successfully..!"; } } ?> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <form method="POST" enctype="multipart/form-data"> <table> <tr> <td> Name <input type="text" name="text"> </td> </tr> <tr> <td> Username <input type="text" name="user"> </td> </tr> <tr> <td> password <input type="password" name="pass"> </td> </tr> <tr> <td> city <select name="city"> <option value="">Select</option> <option value="knp">kanpur</option> <option value="lko">lucknow</option> </select> </td> </tr> <tr> <td> Gender <input type="radio"name="gen" id="gen" value="male">male <input type="radio" name="gen" id="gen" value="female">female </td> </tr> <tr> <td> Image <input type="file" name="f1"> </td> </tr> <tr> <td> <input type="submit" value="submit" name="sub"> </td> </tr> </table> </form> </body> </html> |
Creating a Login Form with Functionality
Here we will create an HTML form with a username and password field. Also, we will create a user authentication query using the same username and password MySQL query and redirect to the home page.
login.php
|
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 |
<?php include'connect.php'; if(isset($_POST['sub'])){ $u=$_POST['user']; $p=$_POST['pass']; $s= "select * from register where username='$u' and password= '$p'"; $qu= mysqli_query($con, $s); if(mysqli_num_rows($qu)>0){ $f= mysqli_fetch_assoc($qu); $_SESSION['id']=$f['id']; header ('location:home.php'); } else{ echo 'username or password does not exist'; } } ?> <html> <head> <title>User Login Form</title> </head> <body> <form method="POST" enctype="multipart/form-data"> <table> <tr> <td> Username <input type="text" name="user"> </td> </tr> <tr> <td> password <input type="password" name="pass"> </td> </tr> <tr> <td> <input type="submit" name="sub" value="submit"> </td> </tr> </table> </form> </body> </html> |
Authenticate Logged in User on Redirection
Here we will authenticate the user on the home page redirection after login. If anyone directly wants to access the home page it checks whether the user is currently logged in or not.
|
1 2 3 4 5 6 7 |
<?php session_start(); if(!isset($_SESSION["id"])){ header("Location: login.php"); exit(); } ?> |
Creating Home Page
After successful login user enters the home page and also sees their data with an image and also logs out from there.
home.php
|
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 |
<?php session_start(); if(!isset($_SESSION["id"])){ header("Location: login.php"); exit(); } include'connect.php'; $s="select * from register where id='$_SESSION[id]'"; $qu= mysqli_query($con, $s); $f=mysqli_fetch_assoc($qu); ?> <html> <body> <table> <tr> <td>Name</td> <td><?php echo $f['name'];?></td> </tr> <tr> <td> Username</td> <td><?php echo $f['username'];?></td> </tr> <tr> <td>Password</td> <td><?php echo $f['password']."<br>";?></td> </tr> <tr> <td> City </td> <td><?php echo $f['city']."<br>";?></td> </tr> <tr> <td>Gender</td> <td><?php echo $f['gender']."<br>";?></td> </tr> <tr> <td> Image</td> <td><img src="<?php echo $f['image'];?>" width="100px" height="100px"></td> </tr> </table> <a href="logout.php">Logout</a> </body> </html> |
Creating a Logout page
For creating a logout operation we have to destroy the session using the PHP session_destroy() function.
logout.php
|
1 2 3 4 5 6 7 8 9 |
<?php session_start(); // Destroying All Sessions if(session_destroy()) { // Redirecting To Home Page header("Location: login.php"); } ?> |
Image Upload using PHP MySQL Snippet
For uploading the image we make sure using
enctype="multipart/form-data"on form tag, like given below.
|
1 |
<form method="POST" enctype="multipart/form-data"> |
For image uploading, the PHP MySQL code snippet is given below,
|
1 2 3 4 5 6 7 |
<?php //code for image uploading if($_FILES['f1']['name']){ move_uploaded_file($_FILES['f1']['tmp_name'], "image/".$_FILES['f1']['name']); $img="image/".$_FILES['f1']['name']; } ?> |
To know more about file upload: https://www.php.net/manual/en/features.file-upload.php
Download Simple PHP CRUD Operation source code:
Also, check:
- jQuery Contact Form Send Email Using Ajax
- How to Store Data In Cookies Using JavaScript
- Steps to Upload Multiple Images in PHP with Preview
- Multiple Barcode Generator in PHP
Complete tutorial to complete login and registration system with PHP & MySQL with Image upload which helps to develop a small PHP project.
Happy Coding..!
Its a very good example sir..
You are a great
dear Admin I need to View Sql Data(images) in horizontal same line.
my source code is as follows please help me:
runQuery(“SELECT * FROM
tbl_imageORDER BY ‘id’ ASC “);if (! empty($query)) {
foreach ($query as $key => $value) {
?>
<img src="”/>
<img src="width=”96px” height=”56px”/>
Hi,
Please check this. If anything else please let me know.
<?php
$qry = mysqli_query(“SELECT * FROM
tbl_imageORDER BY ‘id’ ASC”);while($f=mysqli_fetch_assoc($qry)){ ?>
<img src=”image_directory_loaction/<?php echo $f[‘image.png’];?>” width=”96px” height=”56px”>
<?php } ?>
how can i prevent form submission from submitting php echo error need to fill in the required fields
Check here https://codingtasks.net/user-login-form-validation-using-ajax-in-php/