Hola a todos bueno pues aqui tengo la version 2.0 del minichat hecho con PHP y AJAX pero esta vez usando bases de datos. En mi caso he usado MySQL. Otra de la diferencia es que no carga todo el rato los resultados sino que utilizo una variable oculta con el valor del md5 de la suma de id+comentario+fecha del ultimo comentario y si este es diferente pues lo actualiza, pero mejor vemos el ejemplo ;)
Licencia: LGPL
http://www.gnu.org/licenses/lgpl.html
connect.php
Código PHP:
<?php
/*
Esta es la estructura de la tabla
create table chat( id int(5), comentario text, fecha text, primary key(id));
*/
function Conecta()
{
$nombreddbb="Aqui el nombre de la bases de datos";
if(!($link=mysql_connect("localhost","usuario","password")))
{
echo "Error al conectar con la base de datos.";
exit();
}
if(!mysql_select_db($nombreddbb,$link))
{
echo "Error al elegir la base de datos.";
exit();
}
return $link;
}
$link=Conecta();
?>
index.php
Código PHP:
<?php
include("connect.php");
//
if($_GET["Enviar"]=="si")
{
$max="select max(id) from chat";
$max=mysql_query($max);
$max=mysql_result($max,0,0)+1;
$fecha=date("Y/m/d - H:i:s");
//
$insert="insert into chat values(".$max.",'".htmlentities(utf8_decode($_REQUEST["comentario"]))."','".$fecha."')";
if(trim($_REQUEST["comentario"])!=NULL)
{
$insert=mysql_query($insert);
}
exit();
}
elseif($_GET["Leer"]=="si")
{
header("Cache-Control: no-store, no-cache, must-revalidate");
$select="select * from chat order by id desc limit 0,10";
$select=mysql_query($select);
while($row = mysql_fetch_array($select))
{
if($row["comentario"]!=NULL)
{
echo "<strong>".$row["fecha"]."</strong> - ".$row["comentario"]."<br />";
}
}
exit();
}
elseif($_GET["Hash"]=="si")
{
header("Cache-Control: no-store, no-cache, must-revalidate");
$max="select max(id) from chat";
$max=mysql_query($max);
$max=mysql_result($max,0,0);
//
$select="select * from chat where id=".$max." limit 1";
$select=mysql_query($select);
//
$id=mysql_result($select,0,"id");
$comentario=mysql_result($select,0,"comentario");
$fecha=mysql_result($select,0,"fecha");
//
$hash=$id.$comentario.$fecha;
if($hash==NULL)
{
echo "vacio";
}
else
{
$hash=md5($id.$comentario.$fecha);
echo $hash;
}
exit();
}
?>
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MiniChat :)</title>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript">
setInterval("fajax3()",5000);
</script>
</head>
<body>
<input type="text" id="comentario" size="50" maxlength="50" />
<input type="button" value="bota" onclick="fajax()" />
<div id="chat">
</div>
<input type="hidden" id="id_hash" value="" />
<script type="text/javascript">
document.getElementById('comentario').value="";
document.getElementById('comentario').focus();
fajax3();
</script>
</body>
</html> ajax.js
Código:
function ajaxFunction()
{
var xmlHttp;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
return xmlHttp;
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
return xmlHttp;
}
catch (e)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
return xmlHttp;
}
catch (e)
{
alert("Your browser does not support AJAX!");
return false;
}
}
}
}
function fajax()
{
var comentario;
comentario = document.getElementById('comentario').value;
var ajax;
ajax = new ajaxFunction();
ajax.open("POST","?Enviar=si",true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send("comentario="+comentario);
document.getElementById('comentario').value="";
document.getElementById('comentario').focus();
fajax3();
}
function fajax2()
{
var ajax;
ajax=new ajaxFunction();
ajax.onreadystatechange=function()
{
if(ajax.readyState==4)
{
document.getElementById('chat').innerHTML=ajax.responseText;
}
}
ajax.open("GET","?Leer=si",true);
ajax.send(null);
}
function fajax3()
{
var ajax;
ajax=new ajaxFunction();
var hashviejo;
hashviejo=document.getElementById('id_hash').value;
ajax.onreadystatechange=function()
{
if(ajax.readyState==4)
{
if(hashviejo!=ajax.responseText && ajax.responseText!='vacio')
{
document.getElementById('id_hash').value=ajax.responseText;
fajax2();
}
}
}
ajax.open("GET","?Hash=si",true);
ajax.send(null);
}
Tranquilos que lo he probado en IE tambien ;)
Podeis ver el ejemplo en:
http://zital.no-ip.org/txat/
no me lo peteis ;)