Cara Dasar Membuat Aplikasi Chat Sederhana dengan PHP = Usahawan-maju Mari kali ini kita mencoba membuat script chat yang sederhana dengan PHP, yang satu ini hanya salah satu metode design yang anda sukai sendiri. Bisa kita mulai buatlah 1 file bernama
cahce.html dan biarkan kosong..tidak usah diisi, kemudian lanjut dengan file
berikutnya dibawah ini.
sederhana yang menggunakan session login, mari silahkan kembangkan dengan script login serta logout atau dengan
simpan dengan nama index.php
simpan dengan nama messege.php
sederhana yang menggunakan session login, mari silahkan kembangkan dengan script login serta logout atau dengan
simpan dengan nama index.php
<?php
session_start();
function createForm(){
?>
<form action=”<?php echo $_SERVER['PHP_SELF']; ?>” method=”post”>
<table align=”center”>
<tr><td colspan=”2″>Masukan nama Anda!</td></tr>
<tr><td>Nama Anda: </td>
<td><input type=”text” name=”name” /></td></tr>
<tr><td colspan=”2″ align=”center”>
<input type=”submit” name=”submitBtn” value=”Login” />
</td></tr>
</table>
</form>
<?php
}
if (isset($_GET['u'])){
unset($_SESSION['nickname']);
}
if (isset($_POST['submitBtn'])){
$name = isset($_POST['name']) ? $_POST['name'] : “Unnamed”;
$_SESSION['nickname'] = $name;
}
$nickname = isset($_SESSION['nickname']) ? $_SESSION['nickname'] : “Hidden”;
?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “DTD/xhtml1-transitional.dtd”>
<html>
<head>
<title>AWP Chat</title>
<link href=”style.css” rel=”stylesheet” type=”text/css” />
<script language=”javascript” type=”text/javascript”>
var httpObject = null;
var link = “”;
var timerID = 0;
var nickName = “<?php echo $nickname; ?>”;
function getHTTPObject(){
if (window.ActiveXObject) return new ActiveXObject(“Microsoft.XMLHTTP”);
else if (window.XMLHttpRequest) return new XMLHttpRequest();
else {
alert(“Browser anda tidak support AJAX.”);
return null;
}
}
function setOutput(){
if(httpObject.readyState == 4){
var response = httpObject.responseText;
var objDiv = document.getElementById(“result”);
objDiv.innerHTML += response;
objDiv.scrollTop = objDiv.scrollHeight;
var inpObj = document.getElementById(“msg”);
inpObj.value = “”;
inpObj.focus();
}
}
function setAll(){
if(httpObject.readyState == 4){
var response = httpObject.responseText;
var objDiv = document.getElementById(“result”);
objDiv.innerHTML = response;
objDiv.scrollTop = objDiv.scrollHeight;
}
}
function doWork(){
httpObject = getHTTPObject();
if (httpObject != null) {
link = “message.php?nick=”+nickName+”&msg=”+document.getElementById(‘msg’).value;
httpObject.open(“GET”, link , true);
httpObject.onreadystatechange = setOutput;
httpObject.send(null);
}
}
function doReload(){
httpObject = getHTTPObject();
var randomnumber=Math.floor(Math.random()*10000);
if (httpObject != null) {
link = “message.php?all=1&rnd=”+randomnumber;
httpObject.open(“GET”, link , true);
httpObject.onreadystatechange = setAll;
httpObject.send(null);
}
}
function UpdateTimer() {
doReload();
timerID = setTimeout(“UpdateTimer()”, 5000);
}
function keypressed(e){
if(e.keyCode==’13′){
doWork();
}
}
</script>
</head>
<body onload=”UpdateTimer();”>
<div id=”main”>
<div id=”caption”>AWP Chat</div>
<?php
if (!isset($_SESSION['nickname']) ){
createForm();
} else {
$name = isset($_POST['name']) ? $_POST['name'] : “Unnamed”;
$_SESSION['nickname'] = $name;
?>
<div id=”result”>
<?php
$data = file(“cache.html”);
foreach ($data as $line) {
echo $line;
}
?>
</div>
<div id=”sender” onkeyup=”keypressed(event);”>
Pesan anda: <br/><input type=”text” name=”msg” size=”20″ id=”msg” /><br/>
<button onclick=”doWork();”>Kirim</button>
</div>
<?php
}
?>
</div>
</body>
simpan dengan nama messege.php