Membuat Form Login Dengan PHP Dan MySQL Dengan Mudah - Hai, salam kenal. Di post pertama ini saya akan share bagaimana cara membuat login dengan php. Php sendiri adalah bahasa pemrograman berbasis web yang cukup terkenal.
Kamu pasti sudah mengerti apa itu login bukan? login adalah fitur untuk memastikan bahwa halaman hanya bisa diakses oleh user yang berhak, misalnya halaman admin hanya bisa diakses oleh admin.
Didalam kasus ini kita akan membuat sebuah database yang berisi data untuk autentifikasi pengguna tersebut, selain itu kita akan membuat halaman login dan halaman yang akan diakses dengan menggunakan user yang berhak berdasarkan database yang kita buat.
Membuat Form Login Dengan PHP Dan MySQL
Membuat Database Dan Tabel
- buat database dengan nama belajar_login (hanya contoh), kamu bisa menggunakan phpmyadmin atau juga bisa langsung di cmd.
- buat tabel dengan nama user untuk menyimpan data login dengan field field seperti dibawah ini.
- isikan data sebagai autentifikasi, saya menggunakan phpmyadmin untuk memasukkan satu data user, gunakan sha1 sebagai enkripsi password,dan selanjutnya klik go.
Membuat File Koneksi
fungsi flie koneksi adalah untuk kita koneksi ke dalam database, alangkah baiknya bagian koneksi ini dipisah agar kita tidak perlu membuat koneksi satu persatu untuk setiap halaman yang akan melakukan koneksi kedalam database.Buat sebuah file bernama koneksi.php dan masukkan kode dibawah ini.
<?php
$host="localhost";
$user="root";
$password="";
$database="belajar_login";
$con=mysqli_connect($host, $user, $password, $database);
if (mysqli_connect_errno()) {
echo "Koneksi gagal";
exit();
}
?>
Membuat Form Login (Html Dan Css)
fungsi form login adalah untuk pengguna memasukkan username dan password yang selanjutnya akan diproses apakah data yang dimasukkan itu sesuai dengan yang ada di dalam database, jika data tersebut sama, maka user tersebut bisa mengakses halaman selanjutnya.<!DOCTYPE html>
<html>
<head>
<title>Login</title>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div class="athoul_container">
<h3>Login</h3>
<form action="proseslogin.php" method="post">
<input type="text" name="username" placeholder="Username">
<input type="password" name="password" placeholder="password">
<button type="submit">Login</button>
</form>
</div>
</body>
</html>
Buat juga file index.css untuk melakukan style terhadap tag html diatas, dan masukkan kode dibawah ini.*{
margin: 0;
padding: 0;
font-family: Arial;
}
body{
background: #f1f1f1;
}
.athoul_container{
background: #fff;
max-width: 400px;
margin: 0 auto;
margin-top: 120px;
border-radius: 5px;
}
.athoul_container h3{
padding: 20px;
display: block;
color: #fff;
background:#3498db;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.athoul_container form{
padding: 30px;
}
.athoul_container input{
display: block;
box-sizing: border-box;
padding: 15px;
width: 100%;
margin-bottom:30px;
border: 1px solid #ccc;
outline: 0;
border-radius: 5px;
}
.athoul_container input:focus{
border: 1px solid #565656;
transition: 0.2s;
}
.athoul_container button{
display: block;
box-sizing: border-box;
padding: 10px 25px;
color: #fff;
background: #3498db;
border-radius: 5px;
outline: 0;
border:0;
cursor: pointer;
}
.athoul_container button:hover{
background: #565656;
transition: 0.2s;
}
Membuat file proseslogin
Setelah kita membuat halaman login diatas, sekarang kita akan membuat halaman proses login, fungsi halaman ini adalah untuk mengecek apakah username dan password yang di inputkan oleh user sesuai dengan yang ada didalam database.Jika yang user inputkan tidak sesuai dengan yang ada didalam database maka akan muncul peringatan dan akan di redirect ke halaman index.php, sebaliknya apabila berhasil maka akan di redirect kehalaman home.php.
buat sebuah file bernama proseslogin.php dan isikan kode dibawah ini :
<?php
include "koneksi.php";
$username=$_POST['username'];
$password=sha1($_POST['password']);
if (empty($username) || empty($password)) {
echo "<script>alert('form masih ada yang kosong')</script>";
echo "<script>window.location.href='index.php';</script>";
}
$query=mysqli_query($con,"select * from user where username='$username' and password='$password'");
$cek=mysqli_num_rows($query);
if ($cek > 0) {
$data=mysqli_fetch_array($query);
session_start();
$_SESSION['nama']=$data['nama'];
$_SESSION['username']=$data['username'];
header("location:home.php");
}else{
echo "<script>alert('Login gagal, Username atau password salah')</script>";
echo "<script>window.location.href='index.php';</script>";
}
?>
Membuat halaman home
Didalam tutorial ini, home.php adalah halaman yang membutuhkan hak akses untuk bisa mengaksesnya.oleh karena itu jika ingin mengaksesnya harus login terlebih dahulu dihalaman index.php.
Buat sebuah file bernama home.php dan tuliskan kode dibawah ini.
<?php
session_start();
if (!$_SESSION['username']) {
header("location:index.php");
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Selamat datang <?= $_SESSION['nama'] ?></title>
<style type="text/css">
*{margin: 0;padding: 0;font-family: Arial;}
.container{max-width: 800px;margin: 0 auto;background:#D9EDF7;padding: 20px;box-sizing: border-box;}
</style>
</head>
<body>
<div class="container">
<h3>Selamat datang <?= $_SESSION['nama'] ?></h3>
<a href="logout.php">Logout</a>
</div>
</body>
</html>
Membuat file logout
Logout Berfungsi untuk menghapus session yang kita buat tadi dihalman proses login.php.
Buat sebuah file bernama logout.php dan isikan kode dibawah ini :
<?php
session_start();
session_destroy();
header("location:index.php");
?>
Jika semua step sudah dijalankan dengan benar, apabila kita login akan masuk kedalam halaman home.php seperti dibawah ini.