Advertisement
PHP

[Tutorial] Membuat member online dengan php dan mysql

Saat ini saya mempunyai tutorial tentang membuat member online dengan php. Sebenarnya sih tutorial ini sudah lama, tapi sekarang saya ingin mempublikasikannya lagi.

Maksudnya member online seperti apa ya? Member online yang di maksud itu seperti facebook. Jadi kita bisa melihat siapa saja member yang lagi login/online dan siapa yang tidak. Awalnya saya mencari-cari cara ini berhari-hari padahal sebenarnya mudah, cuma memainkan database. Makhlum masih newbie 😀

Ok langsung saja ke pembahasan.

Buat databasenya dengan nama onlinemember


CREATE TABLE IF NOT EXISTS `user` (
 `id` int(11) NOT NULL AUTO_INCREMENT,
 `username` varchar(30) NOT NULL,
 `name` varchar(30) NOT NULL,
 `password` varchar(100) NOT NULL,
 `confirm` varchar(100) NOT NULL,
 `online` tinyint(4) NOT NULL,
 PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;

Kemudian buat file db.php untuk koneksi ke databasenya.


<?php

//db.php
$host ="localhost";
$user ="root";
$pass = "";
$dbname = "onlinemember";
//untuk mengkoneksikan ke database
$sql_connect= mysql_connect($host, $user, $pass)or die ("fialed to connect database".mysql_error());
$open_db= mysql_select_db($dbname) or die("failed to open database name");
?>

Kita buat file stylenya dulu dengan nama css.css


@charset "utf-8";
html,body,h2 {
 margin:0;
 padding:0;
}
a {
 text-decoration:none;
 color:#008be3;
}
a:hover {
 text-decoration:underline;
 color:#1fa8fe;

}
.input p {
width: 500px ;clear:left; margin: 0;padding: 5px ;
}
.center {
 margin:auto;
 width:800px;
}
.header {
 background:#a6e009;
 height:30px;
 text-align:center;
}
.login {
 width:300px;
 margin:auto;
}
#log {
 height:20px;
 border:1px solid #ccc;
}
#log:hover {
 height:20px;
 border:1px solid #1fa8fe;
}
.submit {
 border:none;
 background:#ccc;
 width:80px;
 height:25px;
 text-align:center;
 font-weight:bold;
}
.submit:hover{
 background:#93c8ea;
}
.home {
 margin:auto;
 width:500px;
}
.register {
 width:300px;
 margin:auto;
}

Nah berikutnya adalah file index.php dan login.php. File ini di gunakan untuk awal situs.


<!--index.php-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link type="text/css" rel="stylesheet" href="css.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Member Online</title>
</head>

<body>
<div><h2>Member Online</h3></div>
<div>
<?php include "login.php";?>
</div>
</body>
</html>

 


<!--login.php-->

<div >
<table>
<form action="login_act.php" method="POST" >
<tr>
<td>Username</td>
<td>:<input id="log" type="text" name="username" /></td>
</tr>
<tr>
<td>Password</td>
<td>:<input id="log" type="password" name="password" /></td>
<tr>
<td><a href="register_index.php">Register</a></td>
<td><input type = "submit" name= "submit" value= "Submit" /></td>
</tr>
</form>
</table>
</div>

Sebelum memasuki ketahap action loginnya, kita buat dulu file register. Buat 3 File register_index.php, register.php, register_act.php

<!--register_index.php-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link type="text/css" rel="stylesheet" href="css.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Member Online</title>
</head>

<body>
<div><h2>Member Online</h3></div>
<div>
<?php include "register.php";?>
</div>
</body>
</html>

 

<!--register.php -->
<div>
<table>
<form action="register_act.php" method="POST" >
<tr>
<td>Username</td>
<td>:<input id="log" type="text" name="username" /></td>
</tr>
<tr>
<td>Name</td>
<td>:<input id="log" type="text" name="name" /></td>
</tr>
<tr>
<td>Password</td>
<td>:<input id="log" type="password" name="password" /></td>
<tr>
<td>Confirm Password</td>
<td>:<input id="log" type="password" name="confirm" /></td>
</tr>
<tr>
<td><a href="index.php">Login</a></td>
<td><input type = "submit" name= "submit" value= "Submit" /></td>
</tr>
</form>
</table>
</div>

 

<?php
//register_act.php

include "db.php";
$username = $_POST['username'];
$name = $_POST['name'];
$password= $_POST['password'];
$confirm = $_POST['confirm'];
$submit = $_POST['submit'];

if ($submit){
//untuk mengecek apakah ada form yang kosong
if ($username&&$name&&$password&&$confirm){
//untuk mencocokan passwordnya
if ($password==$confirm){
//menentukan panjang username dan name
if (strlen($username)>30||strlen($name)>30){
echo "Usernmae and name can not be longer than 30&nbsp;<a href='register_index.php'>Back</a> ";

}
else {
//menentukan panjang passwordnya
if (strlen($password)>25|| strlen($confirm)<6){
echo "Password must 6 - 25!&nbsp;<a href='register_index.php'>Back</a>";

}
else {
//menampilkan data dari database
$get_reg = mysql_query("SELECT * FROM user WHERE username='$username'");
$num_reg = mysql_num_rows($get_reg);
//untuk mengecek apakah username sudah ada
if ($num_reg!=0){
echo "Sorry, username already in use!&nbsp;<a href='register_index.php'>Back</a>";
}
else {
$password = md5($password);
$confirm = md5 ($confirm);
//untuk memasukan data ke database
$insert_reg = mysql_query("INSERT INTO user VALUES ('','$username','$name','$password','$confirm','')");
echo 'Register succsess. Login <a href="login.php">Click here</a>';

}

}
}

}
else {
echo "Your password incorrect!&nbsp;<a href='register_index.php'>Back</a>";
}
}
else {
echo "please input data!&nbsp;<a href='register_index.php'>Back</a>";
}
}

?>

Sekarang kita buat file action untuk loginnya. Buat file dengan nama login_act.php


<?php
//code ini digunakan untuk membuat sessionnya
@session_start();
include "db.php";
$username = $_POST['username'];
$password = $_POST['password'];
//untuk mengecek apakah ada form yang kosong
 if ($username&&$password){
 $get_log = mysql_query("SELECT * FROM user WHERE username='$username'");
 $num_log = mysql_num_rows ($get_log);
 //mengecek apakah username ada atau tidak didalam database
 if ($num_log!=0){
 while ($row = mysql_fetch_assoc($get_log)){
 $dbusername = $row['username'];
 $dbpassword = $row['password'];
 }
 //mengecek kebenaran password
 if ($username==$dbusername&&md5($password)==$dbpassword){
 $_SESSION['username']=$username;
 //ini adalah bagian paling penting untuk membuat who's online atau member online.
 //Ini berfungsi mengupdate field online menjadi 1
 $update_log = mysql_query("UPDATE user SET online ='1' WHERE username = '$username'");
 //code ini berfungsi kalau proses login berhasil maka akan langsung di arahkan kehalaman home_index.php
 header("location:home_index.php");
 exit();

 }
 else {
 echo "Correct password!&nbsp;<a href='index.php'>Back</a>";
 }
 }
 else {
 echo "Username do not exist!&nbsp;<a href='index.php'>Back</a>";
 }
 }
 else {
 echo "Please fill form!&nbsp;<a href='index.php'>Back</a>";
 }

?>

Untuk file berikutnya adalah home_index.php berguna untuk halaman member jika sudah login.


<?php
include "db.php";
@session_start();
$username= $_SESSION['username'];
//mengecek apakah member sudah login apa belum
if ($username){
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Member Online</title>
<link type="text/css" rel="stylesheet" href="css.css" />

</head>

<body>
<div >
<div class="header"><h2>Member Online</h3></div>
<div class="center">
<?php

echo"Welcome&nbsp;".$username."!. <a href='logout.php'>Logout Here</a>";
 ?>

<div>
<div class="online"><h3>Online Member</h3></div>
<div>
<?php
//menampilkan member yang sedang login
$get_on =mysql_query("SELECT * FROM user WHERE online='1'");
while ($row=mysql_fetch_assoc($get_on)){
 $username= $row['username'];
 echo"$username";
}
?>
</div>
</div>

<div>
<div ><h3>Member Logout</h3></div>
<div>
<?php
//untuk menampilkan member yang sudah logout
$get_out =mysql_query("SELECT * FROM user WHERE online='0'");
while ($row=mysql_fetch_assoc($get_out)){
 $username= $row['username'];
 echo"$username";
}
?>
</div>
</div>
</div>
</body>
</html>
<?php
}
 else {
 header("location:index.php");
 }

?>

Terakhir buat file logout.php 


<?php
session_start();
include "db.php";
//ini merupakan code untuk menampilkan username berdasarkan session yang aktif
$username=$_SESSION['username'];
//untuk mengupdate field online menjadi 0
$update = mysql_query("UPDATE user SET online='0' WHERE username='$username'");
//untuk mengakhiri sessionnya
session_destroy();
header("location:index.php");
exit();
?>

Sekian dulu tulisan ini, jika ada yang kurang dimengerti silahkan gunakan kolom komentar untuk menanyakan 😀

Download source      Demo

Selalu menganggap diri seorang pemula. Seorang Website Designer yang lagi suka nulis, juga editing video, dan memperhatikan tren desain. Entrepreneur. Founder & Marketing Palawakia Studio

Related Stories

10 Responses to [Tutorial] Membuat member online dengan php dan mysql

Leave a Reply

Your email address will not be published. Required fields are marked *