Membuat script chat sederhana dengan PHP

Ditulis oleh : - 31 July 2011 - Katagori : PHP, Tags : ,

Chat

Membuat script chat sederhana dengan PHP, ini hanya metode sederhana menggunakan cache session login, silahkan kembangkan dengan script login logout atau dengan design yang anda sukai. Buatlah 1 file bernama cahce.html dan biarkan kosong..tidak usah diisi, lanjut dengan file berikutnya dibawah ini.

File 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>

File messege.php

Berikan G+1 untuk melihat script messege.php

File style.css

#main {
margin: auto;
border: 1px solid #000;
width: 250px;
min-height:150px;
background: #1A71BA;
font-family: Arial, Helvetica, sans-serif;
font-weight:bold;
font-size : 12px;
border-collapse:collapse;
}

#sender {
clear:both;
border: 1px solid #000;
width: 156px;
background: #1A71BA;
font-family: Arial, Helvetica, sans-serif;
font-weight:bold;
font-size : 12px;
padding:2px;
margin-bottom:10px;
margin-top:10px;
margin-left: 40px;
}

td {
padding:5px;
}

#result {
margin-top:20px;
margin-left:40px;
border: 1px solid #000;
width: 156px;
background: #FFF;
text-align:left;
font-family: Arial, Helvetica, sans-serif;
font-weight:bold;
font-size : 12px;
padding:2px;
height:200px;
overflow:auto;
}

.error {
font-family: Arial, Helvetica, sans-serif;
font-weight:normal;
font-size : 10px;
color:#dd1111;
padding:5px;

}

.text {
border: 1px solid #cccccc;
}

input {
border: 0px solid #000;
background: #FFF;
}

#caption{
font-family: Arial, Helvetica, sans-serif;
font-weight:bold;
margin:10px;
font-size : 14px;
text-align: center;
color:#FFF;
}

p{
margin:0px;
padding:0px;
}

.name{
font-weight:bold;
font-style: italic;
color:#D70404;
}

.txt {
font-family: Arial, Helvetica, sans-serif;
font-weight:normal;
font-size:12px;
color:#333;
}

#awpchat{
border:0px;
width:100%;
}

Untuk yang kesulitan silahkan download semua scriptnya berikut-> Script Chat PHP

Kata Kunci Pencarian :

  • membuat chat dengan php
  • script chat php
  • membuat chating dengan php
  • cara membuat chat dengan php
  • script chat
  • script php chat
  • membuat chatting dengan php
  • membuat chat php
  • membuat live chat dengan php
  • script chatting

10 Responses to “Membuat script chat sederhana dengan PHP”

  1. leo says:

    mantap ne kak gee

  2. wisnu says:

    ada contoh aplikasi yg bisa di download gak gan?

  3. Anonymous says:

    cara gabunginnya gmna ya mas ? mohon bimbingannya

    thanks ^_^

  4. epung says:

    bang maksud dari ini “File messege.php

    Berikan G+1 untuk melihat script messege.php”
    apa gak ngerti 😀
    mohon penjelasan

    • Awp Slankers says:

      login ke Gmail / Google Mail… trus refresh page ini.. klik tombol G+1 nanti muncul isi file messege.php

  5. Awp Slankers says:

    ups sory all ada sedikit kesalahan
    link href=”style/style.css” rel=”stylesheet” type=”text/css”
    dirubah jadi
    link href=”style.css” rel=”stylesheet” type=”text/css”

  6. gaje says:

    ini file cache kosong gimana -_-

Leave a Reply

*