<p class="listintro"><span id="sp"></span>编程|聊天室</p> <p style="width:340px;height:285px;float:left;"> 1 页面登陆的基本要素<br>你可以在我的竹叶看到登陆 的表单,这里提供了最基本的登陆表单项<br>(1)登陆表单<br></p> <form method="POST" name="chatform" action="chat/login.php?action=enter" onsubmit="b1_submit();return true;" target="howtodo"> <br>(a)聊天表单的名字为chatform,我使用action=enter作为进入聊天室的入口,如果没有这个参数,则显示登陆页 面.<br>(b)在表单提交时,先调用b1_submit()建立聊天的窗口<br>(c)聊天的目标窗口为b1_submit()建立 的howtodo窗口<br><br>(2)表单项<br>昵称:<input type="text" name="name" size="15" maxlength="10"><br>密码:<input type="password" name="pass" size="15" maxlength="10"><br><input type="submit" name="submit" value="登陆" style="width:100"><br><input type="reset" name="reset" value="重添" style="width:50"><br>(a)各表单项一定要设定最大允许长度 maxlength<br><br>(3)建立聊天窗口的js<br><script language="javascript"><br/>function b1_submit(){<br/>chat=window.open('',"howtodo",'Status=no,scrollbars=no,resizable=no');<br/>chat.moveTo(0,0);<br/>chat.resizeTo(screen.availWidth,screen.availHeight);<br/>chat.outerWidth=screen.availWidth;<br/>chat.outerHeight=screen.availHeight;<br/>}<br/>这段代码先 打开一个没有状态栏,滚动条,可调整尺寸的howtodo窗口!然后移动到屏幕左上角,然后放大到允许的屏幕大小. <br/><br/> 聊天室编程思想--大门 -- 通行证<br/><br/>大门 -- 通行证<br/>聊天室可以采用完全自由的方式运行,你可以随意 输入呢称,不用密码,不保存你的聊天状态,优点是:自由,非常适合于游客!另外一个方法是注册聊天室,每个进入 聊天室的人都要输入自己的用户名和密码才能进入!优点:充分体现个性,非常适合于老朋友,他们的呢称不会被 人恶意侵占使用.我的聊天室使用注册方法!<br/><br/>注册通常采用2种方法:1,先注册然后进入聊天;2,自动注 册,然后在里面修改自己的资料!我采用第2种方法!!每个新进入的聊友的用户名会被自动保存到注册到数据库内 ,下次登陆必须输入准确的密码才能进入!<br/><br/>下面是判断部分!本程序使用文本数据库 !<br/><br/>//$useronline为在线人的数据文件名称<br/>//$useronlinelock为在线人的锁定标志 <br/>//$register为已经注册的数据文件名称<br/>//$registerlock为注册文件的锁定标志<br/>//$split为分隔 符<br/><br/>//登陆参数 enter<br/>if($action == "enter")<br/>{<br/>//当前时间秒数<br/>$timecurrent = date("U");<br/><br/>//锁定在线人数文件,防止同时修改同一个文件<br/>while( file_exists($useronlinelock))<br/>{<br/>if(!file_exists($useronlinelock))<br/>{<br/>break;<br/>}<br/>}<br/><br/>//创建临时文件 <br/>fclose(fopen($useronlinelock,"w"));<br/><br/>//读入在线用户和已经注册用户的信息:密码,昵称,更新时间 <br/>$useronline = file($useronline);<br/>$register = file($register);<br/><br/>//用于判断登 陆是否成功的标志<br/>$namesign=0;<br/><br/>//判断用户名,密码的错误,用户名不允许为空,不允许超过10 个字符,密码不允许超过20个字符<br/>if(($name =="") || (strlen($name) > 10) || (strlen($pass) > 20) )<br/>{<br/>print("没有昵称或密码过长");<br/>//登陆失败<br/>$namesign=1;<br/>//删除临时文件<br/>unlink($useronlinelock);<br/>} <br/>else<br/>{<br/>//查找是否已经有人注册或者密码错误<br/>$foundsign=0;<br/>for($i=0;$i<count($register);$i++)<br/>{<br/>//分割<br/>$tempregister = split($split,$register[$i],99);<br/>//找到已经注册的用户名<br/>if( $name == $tempregister[0] )<br/>{<br/>//已经找到标志<br/>$foundsign=1;<br/>//密码正确吗<br/>if($pass != $tempregister[1])<br/>print("密码错了!");<br/>//登陆失败<br/>$namesign=1;<br/>unlink($useronlinelock);<br/>break;<br/>}<br/>else<br/>{<br/>//老用户登陆成功<br/>$namesign=0;<br/>break;<br/>}<br/>}<br/><br/>}<br/><br/>//如果没有找到这个用户名,那么就自动注册 <br/>if(!$foundsign)<br/>{<br/>//保存用户名和密码<br/>$handle = fopen($register,"a");<br/>fputs($handle,"$name$split$pass$split ");<br/>fclose($handle);<br/>//新 用户登陆成功<br/>$namesign=0;<br/>}<br/>}<br/>}<br/>if(!$namesign)<br/>{ <br/>//更新在线人的名单<br/>$useronlinehandle = fopen($useronline,"w");<br/><br/>//判断是否已经在里面,只是刷新页面<br/>$updatesign = 0;<br/>for($i=0;$i<count($useronline);$i++)<br/>{<br/>$usertemp=split($split,chop($useronline[$i]),99);<br/>if($name == $usertemp[0])<br/>{<br/>//更新标志<br/>$updatesign = 1;<br/>fputs($useronlinehandle,$useronline[$i]);<br/>}<br/>else<br/>{<br/>fputs($useronlinehandle,$useronline[$i]);<br/>}<br/>}<br/>//如 果没有在里面,则增加到里面<br/>if(!$updatesign)<br/>fputs($useronlinehandle,"$name$split$level$split$pass$split$timecurrent ");<br/>fclose($useronlinehandle);<br/><br/>//去掉缩定<br/>unlink($useronlinelock);<br/><br/>//登陆成 功<br/>}<br/><br/>到这里,用户的验证已经完成,聊友已经合法的进入了聊天室,携带者呢称和密码 <br/><br/><br/>聊天室编程思想--大厅 -- 显示界面<br/><br/><br/>大厅 -- 显示界面<br/>2000年09月04<br/>现在的www聊天室基本全部采用框架方式,可以用 frame也可以用iframe看个人喜欢了,我的采用frame的传统方式<br/><br/>print("<frameset rows="*,110,0,0,0" border=0> ");<br/>print("<frameset cols="660,118" rows="*"> ");<br/><br/>//主显示屏幕,负责显示聊天内容<br/>print("<frame name=u src=about:blank frameborder="NO" noresize> ");<br/><br/>//在线人数屏幕<br/>print("<frame name=r src="about:blank" frameborder="NO">");<br/>print(" ");<br/><br/>//发送信息的屏幕,信息指挥中心,所有指令都要由这里发出<br/>print("<frame name=d src=send.php?name=$name&&pass=$pass scrolling='no' frameborder="NO" noresize> ");<br/><br/>//被动更新屏幕,处理发送的信息<br/>print("<frame src="about:blank" name="bl"> ");<br/><br/>/主动更新屏幕,显示自己和其他聊友的聊天信息<br/>print("<frame src="about:blank" name="flush"> ");<br/><br/>//检测是否在线的屏幕,对于异常 离开,如死机,掉线等的处理<br/>print("<frame src="about:blank" name="check"> ");<br/>print(" ");<br/><br/>因为各个页面之间的程序有 联系,所以显示顺序很重要,可以看到,我这里只有发送页面不是about:blank,其他页面的显示都要先通过发送页 面的调用才能开始.<br/><br/><br/>聊天室编程思想--大厅 -- 在线人数<br/><br/>大厅 -- 在线人数<br/><br/>我根据网易聊天室的在线人数的方法,显示当前的在 线人数,代码解释如下:<br/><br/>1 登陆时建立在线人名单的数组,放在body后面<br/><br/><?<br/>//锁定在线 人数文件<br/>while(file_exists($useronlinelock)){$pppp++;}<br/>fclose(fopen($useronlinelock,"w"));<br/><br/>//读入在线人名单<br/>$useronline = file($useronline);<br/>unlink($useronlinelock);<br/><br/>//建立数组 list<br/>print("document.writeln("list=new Array(");<br/>$k=count($useronline);<br/>if($k>1)<br/>{<br/>for($i=0;$i<($k-1);$i++)<br/>{<br/>$usercurrent = split($split,$useronline[$i],99);<br/>// 姓名+,<br/>print("'$usercurrent[0]',");<br/>}<br/>$i=$k-1;<br/>// 处理最后一个姓名 <br/>$usercurrent = split($split,$useronline[$i],99);<br/>print("'$usercurrent[0]'");<br/>}<br/>// 数组结束<br/>print(")"); ");<br/>?><br/><br/>2显示在 线人数的js<br/>document.writeln('[在线人数<font color=red>'+count+']<br>');<br/>document.writeln("[<a href="javascript:parent.cs('所有人')">所有人]<br>");<br/>document.writeln("<font class='p9'>");<br/>var j,name,club;<br/>for(var i=0;i<list.length;i=i+1)<br/>{<br/>if(list[i]!=null){<br/><br/>//显示每个在线人的名字 <br/>document.writeln("<a href="javascript:parent.cs('"+list[i]+"')" title='"+list[i]+"'>"+list[i]+"<br>");<br/>}<br/>}<br/>this.r.document.writeln('<hr>');<br/><br/><br/>3改变聊天对象<br/>function cs(name)<br/>{<br/>if(this.d.document==null)return;<br/>if(name=='所有人')<br/>{<br/>this.d.add('所有人');<br/>this.d.document.inputform.talkto.value='所有人 ';<br/><br/>//改变焦点<br/>this.d.document.inputform.msg.focus();<br/>return;<br/>}<br/>for(var i=0;i<list.length;i=i+1)<br/>{<br/>if(list[i]==name)<br/>{<br/><br/>//更改发送的谈话对象<br/>this.d.document.inputform.talkto.value=list[i];<br/>this.d.document.inputform.msg.focus();<br/>return;<br/>}<br/>}<br/><br/>//错误<br/>alert('此用户已离线或已改了昵称。');<br/>}<br/><br/>4删除一个用户 <br/>function del(str)<br/>{<br/>for(var i=0;i<list.length;i=i+1)<br/>if(list[i]==str)<br/>{<br/>delete list[i];<br/>count--;<br/>}<br/>}<br/><br/><br/>5增加一个用户 <br/>function add(str1,str2)<br/>{<br/>var l=list.length;<br/>for(var i=0;i<list.length;i=i+1)<br/><br/>//如果已经在数组里面则返回<br/>if(list[i]==str1)<br/>return;<br/><br/>//增加一个用户<br/>list[l]=str1;<br/>count++;<br/>}<br/><br/>6更新聊天人数的方法,定时器的使用<br/>var timerID=null;<br/>var timerRunning=false;<br/><br/>function stop()<br/>{<br/>//停止<br/>if(timerRunning)clearTimeout(timerID);<br/>timerRunning=false;<br/>}<br/>function start()<br/>{<br/>stop();<br/>//调用更新在线人数的程序<br/>write1();<br/>}<br/><br/>function write1()<br/>{<br/>... ... ... ...<br/>//设定更新时间,<br/>timerID=setTimeout("start()",30000);<br/>timerRunning=true;<br/>}<br/><br/><br/>这种方法比较简单的实现了在线人数的显示,当然也可以使用读入在线 人文件的方法显示在线人数,不过在改变聊天对象是会比较麻烦.<br/><br/><br/>聊天室编程思想--指挥中心 -- 发送信息<br/><br/>指挥中心 -- 发送信息<br/>这里是聊天室的指挥中心,所有的指令都要在这里发出<br/><br/>1下面是基本的发送表单代码<br/><br/><form name=inputform action='messagesend.php' target='bl' ><br/><? <br/>//读入最大的发言数目<br/>$message = file($filename);<br/>$number = chop($message[0]);<br/><br/>//从上次显示的下一个发言开始到最大发言结束,显示发言内容<br/>for($i=$last+1;$i<=$number;$i++)<br/>{<br/>//读入下一个发言内容<br/>$filename = "messageonline".($i%10).".php";<br/>$message = file($filename);<br/>$tempmessage = split($split,$message[0],99);<br/><br/>//显示发言内容<br/>print("parent.u.document.writeln("$message[0]"); ");<br/>}<br/><br/>//更新发送表单最后一个发言的数目<br/>print("parent.d.document.inputform.last.value=$number; ");<br/><br/>//通知主程序本次更新已经完成<br/>print("parent.flushflag=true; ");<br/>?><br/></script><br><br><br>这样,每个发送的发言,经过被动更新程序处理保存到文件内,然后由一个循环的主动更新程序完成显示任<br>务!!! <br><br> <center> </center> <p style="width:100%;text-align:center;margin:10px 0"> <br> <br> </p> <p style="width:100%;text-align:center;margin:10px 0"> </p> <p class="clear"></p> </form>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
