曾几何时自己想用vc++编一个局域网内的聊天工具，可惜一直没有实现……而自己也渐渐走向了网站开发这条路上来了。

我有时候也会想去在一个网页上进行在线聊天的功能，但是如果将一个页分为不同框架去弄的话，效果很不理想（因为如果要实现不停地更新聊天内容需要使某个框架不停地刷新，这样使得整个网页很不爽…），而且弄起来也不太顺手，而终于是Ajax解救了我。
?
自己实现的时候就涉及到三个文件，一个是html的，一个是php的，一个js的，当然也需要数据库的支持。

界面并没有太好地经过美化，只是用css突出以下内容与IP地址。

代码我就不可能在这里全部都贴出来了……说说自己在弄的过程中一些比较关键的地方罢了。
?
1.需要实现随时更新聊天内容
2.需要将提交的message通过ajax插入到数据库
3.处理编码的问题，一开始这个弄得自己比较头疼，之后Google了不少才终于解决问题
?
说到底就是要实现数据的输入输出的两个重要环节而已，当然你可以在这个基础上添加登录功能与房间功能，还有在线人列表等等……（想起来还是大有搞头的）

（09-12-14 补充：其实现在Paperen自己再看回这篇文章时，确实觉得如果使用我下面说的方法调用AJAX的话那也忒麻烦了点……应该说这种原始的js架构写起来代码很多，以后有机会Paperen会说下用JQuery调用AJAX这种简单而实在的方法）

对于数据的输入，当点击“发表”按钮后就激发一个js函数将数据通过ajax采用post的方式传送到一个php页进行处理并插入数据库，而聊天内容的不断更新则要定义一个js函数使用ajax不停地往那个php页提取数据?

ajax.js 部分代码：
function message()
{
?setInterval("get();",100); //0.1秒就调用get函数
}

当然这个message函数直接放在body后面的onload中就行了。而对于get函数，很明显是需要createXMLHttpRequest()创建一个XMLHttpRequest的对象。?

function get()
{
?createXMLHttpRequest();
?var url,timetmp;
?timetmp=new Date().getTime();
?url="test.php?tmp="+timetmp;
/*这里的timetmp也是个key point，如果没有这个的话，聊天的内容在某些浏览器中就会就更新不出来了，这里还是引用一下权威的解析吧――《深入浅出ajax》书中是这么形容的“给url添加一个时间戳，这个时间戳使得每次访问的URL都不同。这样对与某些浏览器（如IE），就不会产生浏览器对同一个网址进行缓存，从而不会出现页面不能更新的现象”。*/
?xmlHttp.open("GET",url,true);//使用GET的方式
?xmlHttp.onreadystatechange=show;//状态的改变由自定义的show函数进行处理
?xmlHttp.send(null);
}
?
function show()
{
?if(xmlHttp.readyState==4)
?{
? if(xmlHttp.status==200)
? {
?? var message=eval(′(′+xmlHttp.responseText+′)′);//这里进行这步的原理自己也没搞懂，也是从《PHP5高级应用开发实践》书中ajax那节谈到的，作者叫我相信他这样做是对的，所以我照做了，结果也证明了他是对的（不然他也不会写在书里啦……返回的数据是使用json_encode()加工过的）
?? var txt="";
?? for(i=0;i? {
??? txt+=message[i].ip+"? 说："+message[i].message+"? "+message[i].time;//这没什么可说的，构造一个html结构显示数据而已，随意发挥就行
?? }
?? document.getElementById("return").innerHTML=txt;
? }
?} 
}

以上是处理接收数据的js函数，对于点击发表按钮后调用的主要函数?

function talk()
{
?createXMLHttpRequest();
?var url;
?url="test.php";//定义URL
?var poststr;
?poststr="message="+encodeURI(document.getElementById("message").value);//定义post的数据,关键要用encodeURI对数据进行处理
?xmlHttp.open("POST",url,true);//方式为POST
?xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//定义数据头部
?xmlHttp.send(poststr);//发送数据
?xmlHttp.onreadystatechange=result;//状态变化后交给函数result处理
}

result函数就不说了很简单，就是判断发送是否成功而已。
test.php的部分代码：
header("Content-Type:text/html;charset=GBK");//这个是必须的，定义这个页的编码是gbk，不然又会出乱子
我用了if(isset($_POST["message"])){}else{}进行判断目前的操作是数据的接收还是输出
?
对于数据的输出：
先定义sql语句啦$sql="select * from message order by date Desc";
再送入mysql--$result=query($sql);//query是一个自定义函数，参数就是sql语句，返回的是$result;自己习惯了这样用，挺方便的 ^_^，当然你可以选择定义一个class来处理sql相关的操作，看你习惯而定了。
要判断一下是否存在数据吧，

if(mysql_num_rows($result)==0){echo "没有任何信息
"; }
else
? {
?? $sendmessage[]=array();//定义一个容器用于放数据
?? $i=0;//定义数组的下标key
?? while(list($ip,$message,$time)=mysql_fetch_array($result))
?? {
??? $sendmessage[$i]=array(′ip′=>$ip,′message′=>iconv(′gbk′,′utf-8′,$message),′time′=>$time);//将$message的数据进行转化为utf-8的编码
??? $i++;
?? }
?? echo json_encode($sendmessage);//最后用 json_encode处理一下数据
? }

?
这里你可以直接在test.php页中进行测试，不加参数就是了http://192.168.1.16/ajax/test.php，我这里会直接输出经过json_encode处理的数据

[{"ip":"192.168.1.16","message":"u518du770bu770b","time":"09-10-24 15:51:42"},{"ip":"192.168.1.16","message":"u7f16u7801u7684u95eeu9898u771fu662fu633au5565u7684","time":"09-10-24 15:32:44"},{"ip":"192.168.1.16","message":"123","time":"09-10-24 15:22:47"}] 

u7f16u7801u7684u95eeu9898u771fu662fu633au5565u7684这个并不是乱码，而是字符串gbk转化为了utf-8的形式了，在经过ajax.js的show函数处理后就好了。
?
mysql_query("SET NAMES ′GBK′");//定义送入mysql的编码
$message=mysql_escape_string(iconv("UTF-8","GBK",$_POST["message"]));//将数据从utf-8转为gbk再经过mysql_escape_string处理才送入数据库
?
而对与处理输入（其实没啥好说的，就是sql语句呗）

$message=mysql_escape_string(iconv("UTF-8","GBK",$_POST["message"]));//这个也是keypoint喔
$ip=$_SERVER[′REMOTE_ADDR′];
$time=date("y-m-d H:i:s",time());
$sql="insert into message (name,message,date) values(′$ip′,′$message′,′$time′)";
query($sql);

实现一个功能其实并不困难但是也绝对不是件简单的事情（特别是那个编码问题也曾经弄得自己比较郁闷幸好有google的帮助），但自己还是很回味实现功能后的那种感觉，好有成就感。
?
其实这个功能还大有搞头，我还在考虑要不要把它当为毕业设计算了，不过这里它还是相当相当之简陋的，而且可能也存在着一些不足，特别是对于数据的输出部分，因为每次输出都要将以前所有的聊天数据全部输出，我又在想能不能设计成每当有聊天记录增加时才需要与test.php文件进行交流而不是每隔0.1秒就交流一次，这有点浪费。
?
参考URL：
编码的问题：
http://www.feel123.cn/ajax/20080423/277.html
http://www.4wei.cn/?p=1000235
ajax post数据:http://blog.csdn.net/wangdetian168/archive/2007/05/10/1602966.aspx

Jquery Ajax:http://www.cnblogs.com/QLeelulu/archive/2008/04/21/1163021.html
?