Cara menggunakan multi user login javascript

Question

Berikut ini akan dibahas tentang bagaimana membuat login dengan php, dan membuat tingkatan hak akses user untuk setiap halaman.

Table of Contents Show

Membuat Multi User / Multi Level Login dengan Hak Akses Berbeda di PHP
Apa saja yang kita buat untuk login multi user ?
Konfigurasi Database
Integrasi Framework Bootstrap
Buat file-file PHP berikut ini:
#koneksi.php
#penjual.php
#pembeli.php
#logout.php
Uji coba login multi user dengan PHP
Download Source Code

Desain Database
Database berisi dua table, yaitu :

Table s_user, yang berfungsi untuk menampung data user, seperti username dan password.
Table s_login, yang berfungsi untuk mencatat user yang sedang login.

Struktur tabel s_user

Struktur Tabel s_login

Untuk SQL nya s_user :

CREATE TABLE IF NOT EXISTS `s_user` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `username` varchar(50) NOT NULL,
  `password` varchar(100) NOT NULL,
  `nama` varchar(50) NOT NULL,
  `email` varchar(50) NOT NULL,
  `hak_akses` int(11) NOT NULL DEFAULT '1' COMMENT '1=user, 2=operator, 10=administrator',
  `waktu_add` datetime NOT NULL DEFAULT '0000-00-00 00:00:00',
  `waktu_modifi` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
  `status` int(11) NOT NULL DEFAULT '1',
  PRIMARY KEY (`id`),
  UNIQUE KEY `username` (`username`,`email`)
) ENGINE=InnoDB  DEFAULT CHARSET=utf8 AUTO_INCREMENT=104 ;

INSERT INTO `s_user` (`id`, `username`, `password`, `nama`, `email`, `hak_akses`, `waktu_add`, `waktu_modifi`, `status`) VALUES
(100, 'superuser', '141a8eaca4c03163b1e37d8d2a9ae77c', 'Abdurrahman', '[email protected]', 10, '2015-02-22 05:41:56', '2015-02-23 08:54:01', 1),
(101, 'user1', '141a8eaca4c03163b1e37d8d2a9ae77c', 'Sulaiman', '[email protected]', 1, '2015-02-22 05:41:56', '2015-02-23 08:55:28', 1),
(102, 'user2', '141a8eaca4c03163b1e37d8d2a9ae77c', 'Yusuf', '[email protected]', 2, '2015-02-22 05:41:56', '2015-02-23 08:55:03', 1),
(103, 'user3', '141a8eaca4c03163b1e37d8d2a9ae77c', 'Ismail', '[email protected]', 3, '2015-02-22 05:41:56', '2015-02-23 08:55:10', 1);

untuk sql s_login

CREATE TABLE IF NOT EXISTS `s_login` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `key_login` varchar(30) NOT NULL,
  `id_user` int(11) NOT NULL DEFAULT '0',
  `waktu_login` datetime NOT NULL DEFAULT '0000-00-00 00:00:00',
  `waktu_kadaluarsa` datetime NOT NULL DEFAULT '0000-00-00 00:00:00',
  `ip` varchar(100) NOT NULL,
  `pc_dan_browser` varchar(100) NOT NULL,
  `status` int(11) NOT NULL DEFAULT '0',
  PRIMARY KEY (`id`),
  UNIQUE KEY `key_login` (`key_login`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;

File-File Aplikasi
Berikut adalah file-file php dan file Database :

Untuk sementara sampai disini dulu tutorialnya.. silahkan download projectnya disini bagi yang membutuhkan ya..

Halo Sahabat programmer kali ini kita akan belajar untuk membuat login dengan sistem multi user dengan PHP. Apa maksudnya multi user ? Multi user adalah kemampuan aplikasi kita membedakan dan memetakan user berdasarkan levelnya. Nantinya ketika login user akan diarahkan ke masing-masing halamannya sesuai dengan yang telah kita tentukan. Di sisi lain hak akses user akan dibatasi misalnya user A tidak boleh masuk kehalaman yang bisa diakses oleh user B, begitu juga sebaliknya misalnya. Semuanya dapat kita tentukan berdasarkan aturan (rules) yang akan kita buat.

Login multi user telah banyak digunakan saat ini, implementasinya pun banyak pada sistem informasi. Misalnya pada sistem informasi akademik, terdapat beberapa user; mahasiswa, dosen, pegawai administrasi dan lainnya. Contoh yang lain apliakasi E-commerce terdapat user pembeli, penjulan dan administrator.

Baca juga : Membuat form pendaftaran dengan PHP

Pada kesempatan kali ini kita akan belajar membuat login multi user dengan PHP dan mysqli menggunakan studi kasus penjualan. Untuk gambaran sistem login yang akan kita buat adalah seperti pada gambar dibawah ini

Dimana terdapat lebih dari satu user namun mereka masing-masing dibedakan berdasarkan levelnya. User admin ketika login maka dia akan diarahkan pada halaman admin. Sementara user penjual ketika login juga akan diarahkan kehalaman penjual begitu juga dengan pembeli akan diarahkan kehalaman pembeli.

Beberapa aturan lain yang akan kita buat adalah masing-masing user hanya dapat mengakses halamannya saja tanpa bisa mengakses halaman yang lain.

Daftar Isi

Pada tutorial kali ini kita akan membuat beberapa file yang akan membentuk komponen aplikasi sederhana untuk login multi user. Beberapa file tersebut sebagai berikut:

File koneksi database
Halaman Index untuk login
Halaman Administrator untuk user admin
Halaman Penjual untuk user penjual
Halaman Pembeli untuk user pembeli
Halaman Logout untuk keluar

Kita akan buat aplikasi sederhana yang berfokus pada login multi user. Nantinya kalian bisa kembangkan atau gunakan sesuai kasus projek yang kalian buat. Intinya pahami konsep dan logikanya saja, dan tidak perlu terpaku hanya pada coding. Karena seorang programmer yang paling penting adalah logika dan algoritmanya.

Konfigurasi Database

Buat database dengan nama penjualan

create database penjualan;

Gunakan database penjualan

use penjualan;

Buat tabel dengan nama users

create table users(
id_user int not null auto_increment primary key,
username varchar(30) not null,
nama varchar(50),
email varchar(30),
level int,
password varchar(200)
);

Insert 3 data user untuk masing-masing level. disini saya menggunakan level dengan biangan bulat 1 untuk admin, 2 untuk penjual dan 3 untuk pembeli.

INSERT INTO users (username,nama,email,level,password) 
VALUES ('dimas95','Setiawan Dimas','[email protected]',1,md5(12345)),
('roland09','Roland Pugel','[email protected]',2,md5(12345)),
('candra34','Candra Sidauruk','[email protected]',3,md5(12345));

Hasilnya seperi ini

Perhatikan pada field password saya menggunakan enskripsi md5 sehingga tampilan password yang muncul menjadi kode acak. Hal ini digunakan untuk alasan keamanan.

Selanjutnya buat folder dengan nama penjualan didalam htdocs

Integrasi Framework Bootstrap

Pada tutorial kali ini saya menggunakan bootstrap untuk tampilan websitenya. Kalian bisa pelajari bagaimana cara menggunakan bootstrap

Pada artikel yang saya beri link diatas sudah saya bahas bagaimana menggunakan bootstrap mulai dari tahap download hingga bagaimana cara menggunakannya. Kalian bisa juga belajar Tutorial Bootstrap pada situs ini

Buat file-file PHP berikut ini:

#koneksi.php

Tahap berikutnya kita buat file php dengan nama koneksi.php untuk koneksi database.

<?php
$host="localhost";
$user="root";
$password="";
$db="penjualan";

$kon = mysqli_connect($host,$user,$password,$db);
if (!$kon){
	  die("Koneksi gagal:".mysqli_connect_error());
}
?>

#index.php

Buat sebuah file dengan nama index.php file ini nantinya akan menjadi file utama ketika projek penjualan kita dipanggil melalui localhost.

<!DOCTYPE html>
<html>
<head>
    <!-- Load file CSS Bootstrap -->
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
</head>
<body>

    <div class="container">
	<h2>Login multi user dengan PHP</h2><br>
	<?php
		 //Fungsi untuk mencegah inputan karakter yang tidak sesuai
		 function input($data) {
			$data = trim($data);
			$data = stripslashes($data);
			$data = htmlspecialchars($data);
			return $data;
		}
		//Cek apakah ada kiriman form dari method post
		if ($_SERVER["REQUEST_METHOD"] == "POST") {

			session_start();
			include "koneksi.php";
			$username = input($_POST["username"]);
			$p = input(md5($_POST["password"]));

			$sql = "select * from users where username='".$username."' and password='".$p."' limit 1";
			$hasil = mysqli_query ($kon,$sql);
			$jumlah = mysqli_num_rows($hasil);

			if ($jumlah>0) {
				$row = mysqli_fetch_assoc($hasil);
				$_SESSION["id_user"]=$row["id_user"];
				$_SESSION["username"]=$row["username"];
				$_SESSION["nama"]=$row["nama"];
				$_SESSION["email"]=$row["email"];
				$_SESSION["level"]=$row["level"];
		
		
				if ($_SESSION["level"]=$row["level"]==1)
				{
					header("Location:admin.php");
				} else if ($_SESSION["level"]=$row["level"]==2)
				{
					header("Location:penjual.php");
				}else if ($_SESSION["level"]=$row["level"]==3){
					header("Location:pembeli.php");
				}
		
				
			}else {
				echo "<div class='alert alert-danger'>
				<strong>Error!</strong> Username dan password salah. 
			  </div>";
			}

		}
	
	?>
	
	<form action="<?php echo $_SERVER["PHP_SELF"];?>" method="post">
        <div class="form-group">
            <label>Username:</label>
            <input type="text" class="form-control" name="username" placeholder="Masukan Username">
        </div>
        <div class="form-group">
            <label>Password:</label>
            <input type="password" class="form-control" name="password" placeholder="Masukan Password">
        </div>
        <div class="form-group">
            <input type="submit"  class="btn btn-primary"  value="Login">
        </div>
        </form>
    </div>
</body>
</html>

Form akan dikirim ke file index.php dengan perintah action form ke $_SERVER[“PHP_SELF”]; dengan method post.

Jika ada nilai yang dikirim dari form maka akan dicek if ($_SERVER[“REQUEST_METHOD”] == “POST”) jika kondisi bernilai true maka akan dieksekusi perintah dalam blok if tersebut.

Untuk logika sistem login multi user sebenarnya ada pada percabangan PHP dibawah. Coba perhatikan pada sintax bagian ini

 		if ($_SESSION["level"]=$row["level"]==1)
				{
					header("Location:admin.php");
				} else if ($_SESSION["level"]=$row["level"]==2)
				{
					header("Location:penjual.php");
				}else if ($_SESSION["level"]=$row["level"]==3){
					header("Location:pembeli.php");
				}

Terdapat percabangan if dimana mengecek level dari user yang login tersebut. Apabila levenya 1 maka halaman akan diarahkan ke admin.php. Jika levelnya 2 maka diarahkan ke halaman penjual.php dan apabila levelnya 3 maka diarahkan ke halaman pembeli.php

#admin.php

Buat file dengan nama admin.php sintaknya seperti berikut:

<?php
session_start();

if (!isset($_SESSION["username"])) {
	echo "Anda harus login dulu <br><a href='login.php'>Klik disini</a>";
	exit;
}

$level=$_SESSION["level"];

if ($level!=1) {
    echo "Anda tidak punya akses pada halaman admin";
    exit;
}

$id_user=$_SESSION["id_user"];
$username=$_SESSION["username"];
$nama=$_SESSION["nama"];
$email=$_SESSION["email"];

?>
<!DOCTYPE html>
<html>
<head>
 <!-- Load file CSS Bootstrap offline -->
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">

</head>
<body>
    <div class="jumbotron text-center">
      <h1>Selamat Datang di Halaman Administrator</h1>
      <h4>Halaman ini hanya dapat diakses oleh user admin</h4>
        <p>Nama : <?php echo $nama; ?></p>
        <p>Username : <?php echo $username; ?></p>
        <p>Email : <?php echo $email; ?></p>
        <a href="logout.php" class="btn btn-warning" role="button">Logout</a>
    </div>

</body>
</html>

Bila kita perhatikan pada sintak diatas terdapat bagian untuk mengecek apakah user tersebut sudah login atau belum

if (!isset($_SESSION["username"])) {
	echo "Anda harus login dulu <br><a href='login.php'>Klik disini</a>";
	exit;
}

Kondisi diatas mengecek variabel session untuk nilai username apakah ada nilainya atau tidak, jika tidak ada (artinya belum login) maka sistem akan menampilkan “anda harus login dulu”

Selanjutnya coba perhatikan pada sintak

$level=$_SESSION["level"];

if ($level!=1) {
    echo "Anda tidak punya akses pada halaman admin";
    exit;
}

pada sintak bagian ini berfungsi untuk mengecek apakah user yang mengakses halaman admin.php adalah level 1 (level admin) jika user tersebut bukan level 1 maka sistem akan menampilkan pemberitahuan pembatasan hak akses. Karena halaman admin khusus hanya user admin dengan level 1 saja yang boleh mengaksesnya.

#penjual.php

Buat file lagi dengan nama penjual.php isiannya sebagai berikut:

use penjualan;

0

Sama dengan halaman admin.php pada halaman penjual.php hanya user dengan level 2 yang boleh mengaksesnya

use penjualan;

1

Disini kita membuat kondisi level yang bisa mengakses halaman penjual adalah user dengan level 2 (penjual) selain daripada itu tidak dapat mengakses halaman ini.

#pembeli.php

Selanjutnya saya buat sebuah file pembeli.php untuk halaman pembeli

use penjualan;

2

Sama halnya dengan halaman admin maupun penjual. dihalaman pembeli pengguna harus login terlebih dahulu untuk mengakses halaman ini.

Pada halaman pembei hanya boleh diakses oleh pengguna dengan level 3 (pembeli) selain dari pada itu tidak dapat mengaksesnya.

#logout.php

Terakhir kita membuat halaman logout dengan nama logout.php. Halaman ini berfungsi untuk mengosongkan/membersihkan variabel session ketika pengguna melakukan login.

use penjualan;

3

Tahap terakhir saya uji coba sistem login multi user yang telah kita buat. Apakah berjalan dengan baik ?

Saya mencoba login dengan user dimas95

user dimas95 adalah user admin dengan level 1 maka ketika login user tersebut diarahkan ke halaman admin

Ketika user admin ingin mengakses halaman pembeli maka sistem akan memblokir

Mohon diperhatikan bahwa pada artikel ini hanya memberikan contoh terkait penggunaan login multi user. Terkait rule atau aturan didalamnya kalian bisa menyesuaikan dengan aturan yang kalian buat.

Bisa saja kalian bisa membuat aturan user admin boleh mengakses halaman penjual maupun pembeli. Atau user penjual dapat mengakses halaman pembeli sementara user pembeli tidak dapat mengakses halaman penjual. Semuanya bisa kalian buat berdasarkan aturan yang ingin kalian terapkan pada aplikasi yang dibuat.