跳至正文

PHP设计聊天室步步通

  聊天室可以采用完全自由的方式运行,你可以随意输入呢称,不用密码,不保存你的聊天状态,优点是:自由,非常适合于游客!另外一个方法是注册聊天室,每个进入聊天室的人都要输入自己的用户名和密码才能进入!优点:充分体现个性,非常适合于老朋友,他们的呢称不会被人恶意侵占使用.我的聊天室使用注册方法!

  注册通常采用2种方法:

  1、先注册然后进入聊天
    
      2、自动注册

  然后在里面修改自己的资料!我采用第2种方法!!每个新进入的聊友的用户名会被自动保存到注册到数据库内,下次登陆必须输入准确的密码才能进入!

  下面是判断部分!本程序使用文本数据库!

  //
  //
  //
  //
  //

  //登陆参数 enter
  if( == “enter”)
  {
  //当前时间秒数
   = date(“U”);

  //锁定在线人数文件,防止同时修改同一个文件
  while( file_exists())
  {
  if(!file_exists())
  {
  break;
  }
  }

  //创建临时文件
  fclose(fopen(,”w”));

  //读入在线用户和已经注册用户的信息:密码,昵称,更新时间
   = file();
   = file();

  //用于判断登陆是否成功的标志
  =0;

  //判断用户名,密码的错误,用户名不允许为空,不允许超过10个字符,密码不允许超过20个字符
  if(( ==””) || (strlen() > 10) || (strlen() > 20) )
  {
  print(“没有昵称或密码过长”);
  //登陆失败
  =1;
  //删除临时文件
  unlink();
  }
  else
  {
  //查找是否已经有人注册或者密码错误
  =0;
  for(=0;();++)
  {
  //分割
   = split(,,99);
  //找到已经注册的用户名
  if( == )
  {
  //已经找到标志
  =1;
  //密码正确吗
  if( != )
  print(“密码错了!”);
  //登陆失败
  =1;
  unlink();
  break;
  }
  else
  {
  //老用户登陆成功
  =0;
  break;
  }
  }

  }

  //如果没有找到这个用户名,那么就自动注册
  if(!)
  {
  //保存用户名和密码
   = fopen(,”a”);
  fputs(,””);
  fclose();
  //新用户登陆成功
  =0;
  }
  }
  }
  if(!)
  {
  //更新在线人的名单
   = fopen(,”w”);

  //判断是否已经在里面,只是刷新页面
   = 0;
  for(=0;();++)
  {
  =split(,chop(),99);
  if( == )
  {
  //更新标志
   = 1;
  fputs(,);
  }
  else
  {
  fputs(,);
  }
  }
  //如果没有在里面,则增加到里面
  if(!)
  fputs(,”
  trn”);
  fclose();

  //去掉缩定
  unlink();

  //登陆成功
  } 

  到这里,用户的验证已经完成,聊友已经合法的进入了聊天室,携带者呢称和密码

  登录

  1、页面登陆的基本要素

  你可以在我的竹叶看到登陆的表单,这里提供了最基本的登陆表单项

  (1)登陆表单

<form method=POST name=chatform action=chat/login.php?action=enter onSubmit=”b1_submit();return true;” target=”howtodo”>

  (a)聊天表单的名字为chatform,我使用action=enter作为进入聊天室的入口,如果没有这个参数,则显示登陆页面.

  (b)在表单提交时,先调用b1_submit()建立聊天的窗口

  (c)聊天的目标窗口为b1_submit()建立的howtodo窗口

  (2)表单项

  昵称:<input type=text name=name size=15 maxlength=”10″>
  密码:<input type=password name=pass size=15 maxlength=”10″>
  <input type=submit name=submit value=登陆 style=”width:100″>
  <input type=reset name=reset value=重添 style=”width:50″>

  (a)各表单项一定要设定最大允许长度 maxlength

  (3)建立聊天窗口的js

  <script LANGUAGE=”javascript”>
  function b1_submit(){
  chat=window.open(”,”howtodo”,’Status=no,scrollbars=no,resizable=no’);

  chat.moveTo(0,0);
  chat.resizeTo(screen.availWidth,screen.availHeight);
  chat.outerWidth=screen.availWidth;
  chat.outerHeight=screen.availHeight;
  } 

  这段代码先打开一个没有状态栏,滚动条,可调整尺寸的howtodo窗口!然后移动到屏幕左上角,然后放大到允许的屏幕大小.

  在线人数

  我根据网易聊天室的在线人数的方法,显示当前的在线人数,代码解释如下:
    1、登陆时建立在线人名单的数组,放在body后面

  <?
  //锁定在线人数文件
  while(file_exists()){++;}
  fclose(fopen(,”w”));

  //读入在线人名单
   = file();
  unlink();

  //建立数组 list
  print(“document.writeln(“list=new Array(“);
  =count();
  if()
  {
  for(=0;(-1);++)
  {
   = split(,,99);
  // 姓名+,
  print(“”,”);
  }
  =-1;
  // 处理最后一个姓名
   = split(,,99);
  print(“””);
  }
  // 数组结束
  print(“)”);n”);
  ?> 

  2、显示在线人数的js

  document.writeln(‘[在线人数<font color=red>’+count+’</font>]<br>’);
  document.writeln(“[<a href=”javascript:parent.cs(‘所有人’)”>所有人</
  a>]<br>”);
  document.writeln(“<font class=’p9’>”);
  var j,name,club;
  for(var i=0;i<list.length;i=i+1)
  {
  if(list[i]!=null){

  //显示每个在线人的名字
  document.writeln(“<a href=”javascript:parent.cs(‘”+list[i]+”‘)” titl
  e='”+list[i]+”‘>”+list[i]+”</a><br>”);
  }
  }
  this.r.document.writeln(‘</font><hr>’); 

  3、改变聊天对象

  function cs(name)
  {
  if(this.d.document==null)return;
  if(name==’所有人’)
  {
  this.d.add(‘所有人’);
  this.d.document.inputform.talkto.value=’所有人’;

  //改变焦点
  this.d.document.inputform.msg.focus();
  return;
  }
  for(var i=0;i<list.length;i=i+1)
  {
  if(list[i]==name)
  {

  //更改发送的谈话对象
  this.d.document.inputform.talkto.value=list[i];
  this.d.document.inputform.msg.focus();
  return;
  }
  }

  //错误
  alert(‘此用户已离线或已改了昵称。’);
  } 

  4、删除一个用户

  function del(str)
  {
  for(var i=0;i<list.length;i=i+1)
  if(list[i]==str)
  {
  delete list[i];
  count–;
  }
  } 

  5、增加一个用户

  function add(str1,str2)
  {
  var l=list.length;
  for(var i=0;i<list.length;i=i+1)

  //如果已经在数组里面则返回
  if(list[i]==str1)
  return;

  //增加一个用户
  list[l]=str1;
  count++;
  } 

  6、更新聊天人数的方法,定时器的使用

var timerID=null;
  var timerRunning=false;

  function stop()
  {
  //停止
  if(timerRunning)clearTimeout(timerID);
  timerRunning=false;
  }
  function start()
  {
  stop();
  //调用更新在线人数的程序
  write1();
  }

  function write1()
  {
  … … … …
  //设定更新时间,
  timerID=setTimeout(“start()”,30000);
  timerRunning=true;
  } 

  这种方法比较简单的实现了在线人数的显示,当然也可以使用读入在线人文件的方法显示在线人数,不过在改变聊天对象是会比较麻烦.

  显示

  现在的www聊天室基本全部采用框架方式,可以用frame也可以用iframe看个人喜欢了,我的采用frame的传统方式

print(“<frameset rows=”*,110,0,0,0″ border=0>n”);
  print(“<frameset cols=”660,118″ rows=”*”>n”);

  //主显示屏幕,负责显示聊天内容
  print(“<frame name=u src=about:blank frameborder=”NO” noresize>n”);


  //在线人数屏幕
  print(“<frame name=r src=”about:blank” frameborder=”NO”>”);
  print(“</frameset>n”);

  //发送信息的屏幕,信息指挥中心,所有指令都要由这里发出
  print(“<frame name=d src=send.php?name=&&pass= scrolling=’no
  ’ frameborder=”NO” noresize>n”);

  //被动更新屏幕,处理发送的信息
  print(“<frame src=”about:blank” name=”bl”>n”);

/主动更新屏幕,显示自己和其他聊友的聊天信息
  print(“<frame src=”about:blank” name=”flush”>n”);

  //检测是否在线的屏幕,对于异常离开,如死机,掉线等的处理
  print(“<frame src=”about:blank” name=”check”>n”);
  print(“</frameset>n”); 

  因为各个页面之间的程序有联系,所以显示顺序很重要,可以看到,我这里只有发送页面不是about:blank,其他页面的显示都要先通过发送页面的调用才能开始.

  指挥中心

  这里是聊天室的指挥中心,所有的指令都要在这里发出
    1、下面是基本的发送表单代码

<form name=inputform action=’messagesend.php’ target=’bl’ onsubmit=’return(checksay());’ method=POST>

<?
  //下面的2个参数用于验证信息的正确性
  print(“<input type=’hidden’ name=’name’ value=”>n”);
  print(“<input type=’hidden’ name=’pass’ value=”>n”);
  ?>

  //聊天对象,注意加上 readonly 属性
  <input type=”text” name=”talkto” size=”10″ maxlength=”20″ readonly value=”所有人”>

  //上次聊天的发送内容
  <input type=’hidden’ name=’message’ value=”>

  //发送的表单文本框
  <input type=”text” name=”msg” maxlength=”120″ size=”34″>

  <input type=”submit” name=”Submit” value=”发送”>

  </form> 

  2 检查发送内容的js

var dx =”;
  function checksay( )
  {

  //不允许发送空的发言
  if(document.inputform.msg.value==”)
  {
  document.inputform.msg.focus();
  return false;
  }

  //不允许重复发言,内容相同,对象相同
  if ((document.inputform.msg.value==document.inputform.message.value)
  &&(document.inputform.talkto.value==dx))
  {
  alert(‘发言不能重复’);
  document.inputform.msg.focus();
  return false;
  }

  //两次发言内容的间隔不能小于1秒,或者发言字数大于间隔*3
  t2=(new Date()).getTime()/1000;
  if(((t2-t1)<1)||((t2-t1)*3<document.inputform.msg.value.length))
  {
  document.inputform.msg.focus();
  return false;
  }

  //更新时间
  t1=t2;

  document.inputform.showsign.value=1;

  //保存上次发言内容
  document.inputform.message.value =document.inputform.msg.value;

  //清空发言内容
  document.inputform.msg.value =”;

  //保存发言对象
  dx=document.inputform.talkto.value;

  //定位焦点
  document.inputform.msg.focus();

  //返回
  return(true);
  } 

  3、调用信息发送程序,发布聊天者已经进入的信息

  <script>
  parent.bl.document.open();
  parent.bl.document.write(“<meta http-equiv=’refresh’ content=’0;url=messagesend.php?name=<? print(); ?>&&action=enter&&pass=<? print(); ?>’>”)
  parent.bl.document.close();
  </script> 

  发言由messagesend.php处理完成,注意输出对象为bl,也就是处理发言的框架名称,这样保证发言框架的页面内容的完整

  表情和动作

  表情和动作极大的丰富了聊天的乐趣,一般的聊天室主要通过2种方法发送

  (1) 按钮菜单的方法

  通过在一个固定的下拉菜单里面进行选择,找到自己满意的表情,然后选中,按发送按钮发出

  (2) 通过手工输入代号

  比如网易的以手工输入 //hello 代表欢迎的一段动作,以 //bye 代表再见的一段动作表情
    我们这里介绍菜单的具体实现方法,手工输入的不用介绍了吧! 哈哈!除非你记不住那些…

  1 下拉菜单选择表情动作的实现

  为了扩充方便,我们制作了表情动作的数据文件,这样在以后扩充时将会非常方便.

  表情动作文件的格式如下():

  //1234,我的朋友在哪里1234!!!!!”
  //?…
  //??
  //???

  前面的//1234代表表情动作代码,分隔符后面的代表显示的表情动作注意其中的 对象 两个字将会在显示时替换成为发言对象的名字

  这段代码用于把菜单选择的对应的表情动作代码写到发送栏里面

  <script>
  function changemote()
  {
  document.inputform.msg.value =
  }
  </script>

  这段代码生成动态下来菜单

  <select name=”select” onchange=”changemote(this.options[this.selectedIndex].value)”>
  <option value=”0″ selected>动作</option>
  <?
   = file();
  for(=0;();++)
  {
   = split(,,99);
  print(“<option value=></option>”);
  }
  ?>
  </select> 

  这样就完成了从菜单选动作表情的过程

  2 表情动作在发言处理程序里的处理过程

messagesend.php

  <?

  //读入表情动作文件
   = file();
   = count();
  for(=0;;++)
  {

  //分割每个表情动作
  =split(,chop(),99);

  //如果发言内容等于表情动作
  if( == )
  {

  //替换表情动作里面的 对象 为实际的聊天对象名字
  =ereg_replace(“对象”,”<font color=red>/font>”,);

  //发言内容改为动作表情的内容
   = “<a href=javascript:parent.cs(”) target=d>/a
  >”.;
  break;
  }
  }
  ?> 

  这样我们就实现了表情和动作,如果做一个自动添加动作表情的程序功能,更会增加聊天的娱乐性!

  帖图

  如果在聊天文字中能增加一些美丽的图片…….
    图片代码的生成和表情动作一样,可以菜单选择也可以手工输入,这里只给出格式和代码,不再解释,请察看 表情于动作部分

  1 文件格式

  //

  1.jpg
  2.jpg

  编号+名称+图片名称+

  2 程序

  我的聊天室采用 ///gift+编号的方法显示图片,注意是三个反斜杠,区别于表情动作

  <?
  //判断发言的内容最前面的7个字符是否是 ///gift
  if(substr(,0,7) == “///gift”)
  {

  //取得图片的编号,从第7个字符开始的2个字符(注意,字符从0开始编号)
   = substr(,7,2)-1;

  //读入图片文件
   = file();

  //判断是否编号合法
  if(( >= 0) && ( < count()) )
  {
  //分割图片
  =split(,,99);

  //生成图片的发言内容
   =”<a href=javascript:parent.cs(”) target=d><font col
  or=/font></a>送给<a href=javascript:parent.cs(‘
  o’) target=d>/a>一个<img src=’images/’ width=6
  0 height=60 border=0></font>”;

  //图片生成成功标志
   = 1;
  }

  } 

  密谈的实现

  每个聊天室都提供了密谈功能,来为那些需要私下里进行交流的聊友提供方便,这里把我的聊天室实现私聊的方法介绍如下:

  1 对发送信息的处理

  每句私聊都要显示在自己和私聊对象的屏幕上,而其他人不能够看到.这里先对发言内容进行处理,然后再保存到发言文件里面!

  //

  messagesend.php

  <?
  //判断是否私聊发言
  if( == “on”)
  {
  //在发言前面加上标记<!–+私聊标记+对象+发言者+–> 其中+代表分隔符

  //第一个标记为 secret 表示为私聊,后面的是聊天对象和自己的名字,保证这两个人能看到
   = “<!—-><font c
  olor=ff0000>密谈</font>”;
  }
  else
  {

  //如果第一个标记为 open 表示公开,后面同样为对象和自己的名字
   = “<!—->”
  ;
  }

  //然后保存到文件中
  ?> 

  2 显示私聊的方法

  对每个新的发言读入后先进行处理判断,在主动刷新程序里面进行.

  messageflush.php

  <?
  //分割发言内容
   = split(,,99);

  //如果发言不是密谈,或者私聊对象是自己,或者发送这句私聊的是自己,那就显示这句话,否则不显示
  if( ( != “secret”) || ( == ) || (
   == ) )
  {

  //显示私聊
  print(“parent.u.document.writeln(“”);rn”);
  }
  ?> 

  通过这种简单的方法,我们实现了私聊,

  注意:

  前面的保存文件处理时,对发言的判断文字前后有<!– 和 –>这样在屏幕显示时就可以不用特殊处理了!