Tutorial Membuat Sistem Login, Logout dan Register Menggunakan Php dan Bootsrap
Tutorial yang akan kita bahas pada kesempatan ini adalah untuk anda yang baru mempelajari pembuatan website menggunakan php, bagi anda yang sudah mahir, silahkan lewati artikel ini. Pada kesempatan ini kita akan membahas cara membuat sistem login, logout dan register pada sebuah website. Dari tutorial sederhana ini, anda bisa kembangkan ke tahap yang lebih expert.Tentu anda tidak asing lagi dengan istilah sistem login pada sebuah website. Salah satu fungsi dari sistem login adalah pembatasan hak akses fitur yang terdapat pada sebuah website. Dan sistem login adalah salah satu unsur terpenting dalam sebuah aplikasi berbasis website, karna dia adalah pintu gerbang yang mengatur keluar masuk pengguna. Semoga tutorial ini dapat membantu anda memahami dalam membuat sistem login pada website.
Proses login sistem sendiri banyak sekali variasinya ada yang dengan meng query kan email dan password langsung ke dalam database statement dll, Kali ini saya menggunakan metode OOP, Biar mudah mengelolanya.
Karena saya menggunakan cdn Bootstrap jadi saya tidak akan membuat folder untuk css, Oiya, untuk struktur file saya hanya akan menggunakan 1 file PHP untuk login, register, logout dengan menggunakan metode $_GET ok lanjut :)
1. Buat database.
Silahkan buat database terserah namanya. Lalu masukan sql dibawah ini untuk membuat table dan collumnya. Kamu bisa menggunakan phpMyAdmin atau dengan CLI Command.
Karena saya menggunakan cdn Bootstrap jadi saya tidak akan membuat folder untuk css, Oiya, untuk struktur file saya hanya akan menggunakan 1 file PHP untuk login, register, logout dengan menggunakan metode $_GET ok lanjut :)
1. Buat database.
Silahkan buat database terserah namanya. Lalu masukan sql dibawah ini untuk membuat table dan collumnya. Kamu bisa menggunakan phpMyAdmin atau dengan CLI Command.
[php]
CREATE TABLE IF NOT EXISTS `user` (
`id` int(13) NOT NULL AUTO_INCREMENT,
`username` varchar(255) NOT NULL,
`email` varchar(255) NOT NULL,
`password` varchar(255) NOT NULL,
`tgl_register` varchar(255) NOT NULL,
`ip_user` varchar(255) NOT NULL,
PRIMARY KEY (`id`),
UNIQUE KEY `id` (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;
[/php]
2. class.php
Buat file class.php yang berisi kode dibawah ini.
[php]
<?php class database { var $tanggal_sekarang; var $ip_user; public $mysqli; /* TEMPATKAN DATABASE CREDENTIAL ANDA DISINI SEPERTI NAMA DATABASE USER, PASSWORD, DLL */ function __construct() { $this->mysqli = new mysqli('myhost','myuser','mypass','mydb');
if (mysqli_connect_error()) {
die('Connect Error (' . mysqli_connect_errno() . ') '
. mysqli_connect_error());
}
}
/* membuat fungsi untuk register */
function register($nama,$email,$password) {
$user = new database(); // Init class
$user->tanggal_sekarang = date("d-m-Y");
$user->ip_user = $_SERVER['REMOTE_ADDR'];
$stmt = "INSERT INTO user(username,email,password,tgl_register,ip_user)
VALUES('$nama','$email','$password','$user->tanggal_sekarang','$user->ip_user')"; // Statement untuk memasukan data user ke database
if($user->mysqli->query($stmt) == true) {
return true;
} else {
return false;
}
}
function login($email,$password) {
$user = new database();
$stmt = "SELECT * FROM user WHERE email = '$email'";
if($udata = $user->mysqli->query($stmt)) {
if($udata = mysqli_fetch_array($udata)) {
if($password == $udata['password']) {
$_SESSION["userSession"] = $udata['id'];
echo "<script type='text/javascript'>window.top.location='home.php';</script>";
} else {
echo "<script type='text/javascript'>window.top.location='?do=login&r=wp';</script>";
}
}
}
}
}
[/php]
Ganti myhost dengan host database anda, myuser dengan user database anda, mypass dengan password database anda, dan mydb dengan nama database anda.
3. index.php
Dalam file PHP Ini semua proses login, register, logout akan dilakukan dengan metode $_GET, Silahkan paste kode dibawah ini.
[php]
<?php
session_start();
include ('class.php');
if(isset($_GET['do']) && $_GET['do'] == "register") {
if(!empty($_SESSION['userSession'])) {
echo "<script type='text/javascript'>window.top.location='home.php';</script>";
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Belajar sistem register, login, logout dengan PHP dan MySQL</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<style>
body {
background: url(http://lorempixel.com/1920/1920/city/9/) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.panel-default {
opacity: 0.9;
margin-top:30px;
}
.form-group.last { margin-bottom:0px; }
</style>
<div class="container">
<div class="row">
<div class="col-md-4 col-md-offset-7">
<div class="panel panel-default">
<div class="panel-heading">
<span class="glyphicon glyphicon-lock"></span> Register
</div>
<div class="panel-body">
<?php /* Kode PHP Disini digunakan untuk memproses data yang dikirim user */ if(isset($_POST['btn-register'])) { $nama = trim($_POST['name']); $email = trim($_POST['email']); $pass = md5(md5(trim($_POST['password']))); $user = new database(); $stmt = "SELECT * FROM user WHERE email = '$email'"; if($result = $user->mysqli->query($stmt)) {
if($result->num_rows > 0 ) {
echo "
<div class='alert alert-danger'>Maaf user dengan email <b>$email</b> Sudah terdaftar.</div>
";
} else {
if($user->register($nama,$email,$pass) == true ) {
echo "
<div class='alert alert-success'>Selamat!, Akun kamu telah berhasil dibuat :)</div>
";
} else {
echo "
<div class='alert alert-warning'>Maaf, Terjadi kesalahan, Harap coba lagi :)</div>
";
}
}
}
}
?>
<form class="form-horizontal" role="form" method="post">
<div class="form-group">
<label for="inputEmail3" class="col-sm-3 control-label">Username</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputEmail3" placeholder="Username" name="name" required></div>
</div>
<div class="form-group">
<label for="inputEmail3" class="col-sm-3 control-label">Email</label>
<div class="col-sm-9">
<input type="email" class="form-control" id="inputEmail3" placeholder="Email" name="email" required></div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-3 control-label">Password</label>
<div class="col-sm-9">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password" name="password" required>
<button class="btn btn-success" type="submit" name="btn-register">REGISTER</button> OR <a class="btn btn-warning" href="?do=login">LOGIN</a>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<hr>
Copyright © <?php echo date("Y") ?> sourcecodeaplikasi.info
</body>
</html>
<?php
} elseif(isset($_GET['do']) && $_GET['do'] == "login") {
if(!empty($_SESSION['userSession'])) {
echo "<script type='text/javascript'>window.top.location='home.php';</script>";
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Belajar sistem register, login, logout dengan PHP dan MySQL</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<style>
body {
background: url(http://lorempixel.com/1920/1920/city/9/) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.panel-default {
opacity: 0.9;
margin-top:30px;
}
.form-group.last { margin-bottom:0px; }
</style>
<div class="container">
<div class="row">
<div class="col-md-4 col-md-offset-7">
<div class="panel panel-default">
<div class="panel-heading">
<span class="glyphicon glyphicon-lock"></span> Login
</div>
<div class="panel-body">
<?php
/* Kode PHP Disini digunakan untuk memproses data yang dikirim user */
if(isset($_GET['r']) && $_GET['r'] == "wp") {
echo "
<div class='alert alert-danger'>Maaf, Password yang anda masukan salah, Silahkan periksa ulang :)</div>
";
} elseif(isset($_GET['r']) && $_GET['r'] = "sl") {
echo "
<div class='alert alert-success'>Anda berhasil logout :), Selamat!</div>
";
}
if(isset($_POST['btn-login'])) {
$user = new database();
$email = trim($_POST['email']);
$pass = trim(md5(md5($_POST['password'])));
if($result = $user->mysqli->query("SELECT * FROM user WHERE email = '$email'")) {
if($result->num_rows > 0 ) {
$user->login($email,$pass);
} else {
echo "
<div class='alert alert-danger'>Maaf, User dengan email <b>$email</b> Belum terdaftar, Silahkan register terlebih dahulu :) </div>
";
}
}
}
?>
<form class="form-horizontal" role="form" method="post">
<div class="form-group">
<label for="inputEmail3" class="col-sm-3 control-label">Email</label>
<div class="col-sm-9">
<input type="email" class="form-control" id="inputEmail3" placeholder="Email" name="email" required></div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-3 control-label">Password</label>
<div class="col-sm-9">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password" name="password" required>
<button class="btn btn-success" type="submit" name="btn-login">LOGIN</button> OR <a class="btn btn-warning" href="?do=register">REGISTER</a>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<hr>
Copyright © <?php echo date("Y") ?> rizalfakhri
</body>
</html>
<?php } elseif(isset($_GET['do']) && $_GET['do'] == "logout") { session_destroy(); header("location: ?do=login&r=sl"); } else { if(empty($_SESSION['userSession'])) { header("location: ?do=login"); } else { header("location: home.php"); } } ?>
[/php]
4. home.php
Bila user telah berhasil login maka user akan dialihkan ke home.php paste kode dibawah ini.
[php]
<?php
session_start(); // Init session
if(empty($_SESSION["userSession"])) {
// kode yang akan di eksesuki jika tidak ada session atau user belum login
echo "SILAHKAN LOGIN TERLEBIH DAHULU "; // ini hanya contoh kamu boleh hapus dan mengganti dengan kodemu
} else {
echo "SUKSES LOGIN :) <a href='//".$_SERVER['SERVER_NAME']."/?do=logout'>Logout</a>"; // ini hanya contoh kamu boleh hapus dan menggantinya dengan kodemu
}
[/php]
SELESAI....
Mari saya jelaskan cara kerja kode yang baru saja kalian tulis.
class.php
Disini saya menulis function login dan register, guna function tersebut adalah biar memudahkan kita jika mau login atau register tinggal panggil saja functionya sama seperti memanggil built in function pada php misal function echo ""; atau mysqli_query("");.
Tapi saya tidak bisa langsung memanggil function tersebut secara langsung, karena function didalam class disebut method jadi saya harus menginisialisasi objectnya terlebih dahulu sebagai contoh saya akan membuat class benda seperti kode dibawah ini.
[php]
class benda {
public $nama = "sapu";
public $berat = "2 kilo";
public $jumlah = 1;
function jumlah_sapu() {
return $this->jumlah;
}
// atau saya membuat method tambah sapu
function tambah_sapu($jumlah) {
return $this->jumlah + $jumlah;
}
}
[/php]
Jadi jika saya akan memanggil method tambah_sapu() kode yang harus saya tulis adalah seperti dibawah ini.
[php]
$sapu = new benda();
echo "jumlah sapu sekarang ".$sapu->tambah_sapu(5);
[/php]
Kira2 seperti itu lah gan, untuk PHP Class akan saya bahas lain waktu hehehe :D
index.php
dalam file index.php tersebut terdapat kode if(isset($_GET['do']) && $_GET['do'] == "login") { ...
Maksud kode tersebut adalah untuk menuju halaman login, Jadi jika kamu mau mengakses login page silahkan buka http://localhost/?do=login begitu juga dengan register tinggal ubah jadi http://localhost/?do=register.
Perlu diingat!
Selalu tambahkan kode dibawah ini di baris paling pertama pada file php yang mewajibkan user untuk login,.
[php]
session_start(); // Init session
if(empty($_SESSION["userSession"])) {
// kode yang akan di eksesuki jika tidak ada session atau user belum login
} else {
// kode yang akan dieksekusi jika berhasil login
}
[/php]
sumber : blog.rizalfakhri.com
Terima kasih telah membaca tentang Tutorial Membuat Sistem Login, Logout dan Register Menggunakan Php dan Bootsrap
Aneka Source Code Aplikasi - Tutorial Membuat Sistem Login, Logout dan Register Menggunakan Php dan
Bootsrap, Semoga bisa membantu anda dalam belajar pemrograman atau mungkin dapat juga menjadi ide atau inspirasi untuk membuat karya baru yang lebih baik lagi.
0 Response to "Tutorial Membuat Sistem Login, Logout dan Register Menggunakan Php dan Bootsrap"
Posting Komentar