Wednesday, July 4, 2012

Teknik Membuat Aplikasi Chat Sederhana dalam PHP

Prinsip Kerja Aplikasi Chating

Pada desktop aplication banyak kita temui aplikasi chat seperti ym,mirc,etc..,konsep keja mereka sama saja yaitu :

1. aplkasi client (mirc) meminta request untuk bergabung dengan server irc dengan mengirimkan data data client
2. server akan membuat sebuah sesi untuk cient tersebut..lalu memberikan respon berupa data percakapan pengguna dimulai dari waktu user login sampai wwaktu sekarang
3. pada interval tertentu server akan mencek apakah user benar2 online

The Code

Pertama kita membuat aplikasi server yang akan menangani setiap request dari client. ketik kode berikut dan simpan dengan nama message.php

Code:
<?
session_start();
include "db.php";
        $status="active";
        $waktulogin=$_SESSION[waktulogin];
        $exp=date("His")+600;
        $uid=substr(session_id(),0,15);
        $time_now=date("His");
        $nick=$_SESSION[nick];
echo "qq";
function show_mesage()
{

global $status,$waktulogin,$exp,$uid,$time_now,$nick;

$sqlchat="select * from user,chat where chat.post_time >='$waktulogin' and chat.post_time <='$time_now' and user.nick_name=chat.nick_name";
// debug : echo "$sqlchat";
$qrychat=mysql_query($sqlchat) or die (mysql_error());
    $i=0;
    while ($datachat=mysql_fetch_array($qrychat))
    {
    $i++;
      echo "$i:< $datachat[nick_name] > : $datachat[pesan]<br></div>";
    }

}
function update_user()
{
global $status,$waktulogin,$exp,$uid,$time_now,$nick;

  $sql_exp="update user set exp_time='$exp' where nick_name='$nick'";
  mysql_query($sql_exp) or die (mysql_error()); 
}

function delete_user()
{
global $status,$waktulogin,$exp,$uid,$time_now,$nick;

$sql_del_user="delete from user where exp_time=$time_now or exp_time<=$time_now";
mysql_query($sql_del_user) or die (mysql_error());

}

function init()
{
global $status,$waktulogin,$exp,$uid,$time_now,$nick;

echo show_mesage();
delete_user();
update_user();
}

function save_message()
{
global $status,$waktu_login,$exp,$uid,$time_now,$nick,$msg;
$sqlchat="insert into chat (nick_name,pesan,post_time) values ('$nick','$msg','$time_now')";
$qrychat=mysql_query($sqlchat)or die(mysql_error());

}

function list_user()
{
echo "<b>USER LIST</b><br><br>";
$sqluser="select * from user";
$qryuser=mysql_query($sqluser) or die (mysql_error());
while ($datauser=mysql_fetch_array($qryuser))
 {
  if ($_SESSION[nick]==$datauser[nick_name])
  {
    echo "<b>< $datauser[nick_name] ></b><br>";
  }
  else
  {
    echo "<a href=private_room.php?nick1=$_SESSION[nick]&nick2=$datauser[nick_name] target=_blank>< $datauser[nick_name] ></a> <br>";
  }
 }

}

function cek_pv()
{
global $status,$waktulogin,$exp,$uid,$time_now,$nick;

$sqluser="select distinct(sender),received from private_room where received='$nick'";
$qryuser=mysql_query($sqluser) or die (mysql_error());
while ($datauser=mysql_fetch_array($qryuser))
 {
  if ($nick==$datauser[received]){
  echo "| <a href=private_room.php?nick1=$_SESSION[nick]&nick2=$datauser[sender] target=_blank>< $datauser[sender] ></a> |";
  }
 }


}
 
 
 
 
    switch($_GET[action])
    {
        case "" :
        {
        init();break;
        }
        case "view":
        {
          init();break;
        }
        case "send":
        {
              $msg=$_GET[inputText];
            save_message();
            init();
            break;
     
        }
        case "cek_pv":
        {
        echo cek_pv();break;
        }
        case "list_user":
        {
        echo list_user();
        break;
        }
     

    }
?>



sebelumnya buat file db.php untuk konfigurasi dan koneksi ke mysql database :
Code:
<?
$dbhost="localhost";
$dbuser="root";
$dbpass="";
$dbname="chat_db";

mysql_connect($dbhost,$dbuser,$dbpass) or die(mysql_error());
mysql_select_db($dbname) or die(mysql_error());
?>


Sebagai antar muka client buat file dengan nama client.php dan masukkan kode berikut:
Code:
<?
//session_start();
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <title>Untitled Document</title>
  <script language="javascript" type="text/javascript">

function getHTTPObject()
{
  var xmlHttp

  try
  {
    //Firefox, Opera 8.0+, Safari
    xmlHttp = new XMLHttpRequest();
  }
  catch(e)
  {
    //Internet Explorer
    try
    {
      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch(e)
    {
      try
      {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      }
      catch(e)
      {
        alert("Your browser does not support AJAX!")
        return false;
      }
    }
  }
  return xmlHttp;
}

function setuserlist()
{
      if(ulisthttpObject.readyState == 4)
      {
        document.getElementById('userlist').innerHTML = ulisthttpObject.responseText;
      }
}

function userlist()
{
              ulisthttpObject = getHTTPObject();
              if (ulisthttpObject != null)
                {
                  ulisthttpObject.open("GET", "message.php?action=list_user", true);
                  ulisthttpObject.onreadystatechange = setuserlist;
                  ulisthttpObject.send(null);

                }
}

 function setOutput()
  {
 
    if(httpObject.readyState == 4)
    {
        document.getElementById('outputText').innerHTML = httpObject.responseText;
    }
 }


function reQuest()
{
        userlist();
    cekPrivate();
  httpObject = getHTTPObject();
           
              if (httpObject != null)
                {
                  httpObject.open("GET", "message.php?action=view", true);
                  httpObject.onreadystatechange = setOutput;
                  httpObject.send(null);

                }
             

}

  function sendMesage()
    {
            httpObject = getHTTPObject();
              if (httpObject != null)
                {
                  httpObject.open("GET", "message.php?action=send&inputText="
                                    +document.getElementById('inputText').value, true);
                  httpObject.onreadystatechange = reQuest;
                  httpObject.send(null);

                }
             
    }
 function set_pv()
  {
 
    if(pvhttpObject.readyState == 4)
    {
        document.getElementById('top_panel').innerHTML = pvhttpObject.responseText;
    }
 }
function cekPrivate()
    {
            pvhttpObject = getHTTPObject();
              if (pvhttpObject != null)
                {
                  pvhttpObject.open("GET","message.php?action=cek_pv",true);
                  pvhttpObject.onreadystatechange = set_pv;
                  pvhttpObject.send(null);

                }
             
    }

function reFresh()
{
  window.setInterval("reQuest()",1000);//-->
}
</script>
  <style type="text/css">
<!--
.output {
    border: 1px solid #555555;
    overflow: scroll;
    width: 75%;
    height: 400px;
    float:left; 

}
.usrlist {
    border: 1px solid #555555;
    width: 20%;
    float: right;
    height: 400px;    overflow: scroll;

    }
.inputbox
{
    width: 100%;
}
.top_panel
{
    background-color: #ECE9D8;
    text-align: right;
    margin:5px;
    padding:5px;
}
-->
  </style>
  </head>

<body onLoad="reFresh();">
<div class="top_panel" id="top_panel">| <a href="#">Log out</a></div>
<div class="output" id="outputText"  name="outputText"></div>
<div class="usrlist" id="userlist" name="userlist"></div>
<div class="inputbox">
  <form name="form1">
    <input name="inputText" type="text" id="inputText" size="100">
    <input type="button" value="Kirim Pesan" onClick="sendMesage();">
  </form>
</div>
</body>

  </html>

Terakhir kita akan membuat daftar user yang join ke server simpan dengan nama userlist.php
Code:
<?

include "db.php";
echo "<b>USER LIST</b><br><br>";
$sqluser="select * from user";
$qryuser=mysql_query($sqluser) or die (mysql_error());
while ($datauser=mysql_fetch_array($qryuser))
{
echo "<a href=private_room.php?id=$datauser[nick_name] target=_blank>< $datauser[nick_name] ></a> <br>";
}
?>


jangan lupa untuk membuat databasenya :
Code:
CREATE TABLE `chat` (
  `nick_name` varchar(15) collate latin1_general_ci NOT NULL,
  `pesan` varchar(100) collate latin1_general_ci NOT NULL,
  `post_time` varchar(10) collate latin1_general_ci NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci;

CREATE TABLE `user` (
  `fullname` varchar(50) collate latin1_general_ci NOT NULL,
  `nick_name` varchar(15) collate latin1_general_ci NOT NULL,
  `status` varchar(10) collate latin1_general_ci NOT NULL,
  `user_id` varchar(15) collate latin1_general_ci NOT NULL,
  `exp_time` varchar(10) collate latin1_general_ci NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci;
 
Source:  http://surabaya-programing.forumotion.com/





Anda ingin mencari refrensi dan contoh program lengkap ? Kami ada. Sekarang Anda bisa mencari Aplikasi PHP MySQL di situs ini : http://www.bunafitkomputer.com. Koleksi program lengkap di sana, proyek PHP dan MySQL, juga jQuery dan Framework. Bukunya juga ada.

1 comment:

  1. bagus nih artikel, hanya saja kenapa tidak di cantumkan kode-kode yang harus ditulis di suatu tempat...

    ReplyDelete