Membuat halaman Login
Setelah function kita buat, selanjutnya kita akan buat halaman login.php yang akan kita jadikan sebagai halaman default. Pertama kali user akses. akan redirect ke halaman login.php
Buatlah new file di folder project “rumah_coding” dengan nama “login.php”. Pada halaman ini kita akan membuat session, cookies, dan validasi untuk tombol login. Gambar dibawah ini adalah tag php. untuk membuat session, memanggil function, cek cookies, dan validasi tombol login.
Kemudian setelah tag penutup php ( ?>) baru kita ketikan baris program html untuk mendesign form login.php
Silahkan copy source codenya dibawah ini. dan Pelajari logikanya.
<?php
// jalankan session
session_start();
// panggil koneksi
require ‘function.php’;
/*cek cookie*/
if ( isset($_COOKIE[‘id’]) && isset($_COOKIE[‘key’]) ) {
$id = $_COOKIE[‘id’];
$key = $_COOKIE[‘key’];
// ambil username berdasarkan id
$result = mysqli_query($conn,”SELECT username FROM user WHERE id = $id”);
$row = mysqli_fetch_assoc($result);
// cek cookie dan username
if ( $key === hash(‘sha256’, $row[‘username’]) ) {
$_SESSION[‘login’] = true;
}
}
if ( isset($_SESSION[“login”])){
header(“Location: index.php”);
exit;
}
// cek apakah tmbol login sudah ditekan atau belum
if (isset($_POST[“login”])) {
$username = $_POST[“username”];
$password = $_POST[“password”];
$result = mysqli_query($conn, “SELECT * FROM user WHERE username = ‘$username'”);
// cek username
if (mysqli_num_rows($result) ===1 ) {
// cek password
$row = mysqli_fetch_assoc($result);
if ( password_verify($password,$row[“password”])){
// set session
$_SESSION[“login”] = true;
// cek remember me
if ( isset($_POST[‘remember’])) {
// buat cookie
setcookie(‘id’,$row[‘id’], time()+60);
setcookie(‘key’, hash(‘sha256’,$row[‘username’],time()+60));
}
header(“Location: index.php”);
exit;
}
}
$error = true;
}
?>
<!DOCTYPE html>
<html>
<head>
<!–Import Google Icon Font –>
<link href=”https://fonts.googleapis.com/icon?family=Material+Icons” rel=”stylesheet”>
<!–Import materialize.css–>
<link type=”text/css” rel=”stylesheet” href=”css/materialize.min.css” media=”screen,projection”/>
<link type=”text/css” rel=”stylesheet” href=”css/login.css”>
<!–Let browser know website is optimized for mobile–>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″/>
</head>
<body>
<div class=”container”>
<div class=”row”>
<div class=”col m6 offset-m3 s12″>
<form action=”” method=”post”>
<div class=”card-panel hoverable grey lighten-3″>
<h5 class=”center”>Login</h5>
<br>
<div class=”input-field”>
<input type=”text” name=”username” id=”username” required class=”validate” autofocus>
<label for=”text”>Username</label>
</div>
<div class=”input-field”>
<input type=”password” name=”password” id=”password” required class=”validate”>
<label for=”password”>Password</label>
</div>
<button type=”submit” class=”submit btn teal darken” value=”login” name=”login”>Login</button>
<span><button type=”submit” class=”btn white darken”><a href=”registrasi.php”>Daftar</a></button></span>
</div>
</form>
</div>
</div>
</div>
<?php if ( isset($error)) :
echo “<script>
alert (‘Username atau password salah!’);
</script>”;
?>
<?php endif; ?>
<!–JavaScript at end of body for optimized loading–>
<script type=”text/javascript” src=”js/materialize.min.js”></script>
</body>
</html>
Setelah itu coba akses websitenya di “localhost/rumah_coding/login.php”
Jika berhasil halaman login.php bisa tampil di website anda.


