PHP实现最简单的聊天室应用

介绍

聊天应用程序在网上非常常见。开发人员在构建这类应用程序时的选择也很多。这篇文章介绍了如何实现基于PHP-AJAX的聊天应用程序,并且不需要刷新页面就可以发送和接收消息。

核心逻辑

在定义应用程序的核心功能之前,先来看一看聊天应用程序的基本外观,如以下截图所示:

通过聊天窗口底部的输入框输入聊天文本。点击Send按钮,就开始执行函数set_chat_msg。这是一个基于Ajax的函数,因此无需刷新页面就可以将聊天文本发送到服务器。程序在服务器中执行chat_send_ajax.php以及用户名和聊天文本。


  1. // 
  2. // Set Chat Message 
  3. // 
  4.  
  5. function set_chat_msg() 
  6.     if(typeof XMLHttpRequest != "undefined") 
  7.     { 
  8.         oxmlHttpSend = new XMLHttpRequest(); 
  9.     } 
  10.     else if (window.ActiveXObject) 
  11.     { 
  12.        oxmlHttpSend = new ActiveXObject("Microsoft.XMLHttp"); 
  13.     } 
  14.     if(oxmlHttpSend == null) 
  15.     { 
  16.        alert("Browser does not support XML Http Request"); 
  17.        return; 
  18.     } 
  19.  
  20.     var url = "chat_send_ajax.php"; 
  21.     var strname="noname"; 
  22.     var strmsg=""; 
  23.     if (document.getElementById("txtname") != null) 
  24.     { 
  25.         strname = document.getElementById("txtname").value; 
  26.         document.getElementById("txtname").readOnly=true; 
  27.     } 
  28.     if (document.getElementById("txtmsg") != null) 
  29.     { 
  30.         strmsg = document.getElementById("txtmsg").value; 
  31.         document.getElementById("txtmsg").value = ""; 
  32.     } 
  33.  
  34.     url += "?name=" + strname + "&msg=" + strmsg; 
  35.     oxmlHttpSend.open("GET",url,true); 
  36.     oxmlHttpSend.send(null); 

PHP模块从Query String(查询字符串)中接收表单数据,更新到命名为chat的数据库表中。chat数据库表有命名为IDUSERNAMECHATDATEMSG的列。ID字段是自动递增字段,所以这个ID字段的赋值将自动递增。当前的日期和时间,会更新到CHATDATE列。


  1. require_once('dbconnect.php'); 
  2.  
  3. db_connect(); 
  4.  
  5. $msg = $_GET["msg"]; 
  6. $dt = date("Y-m-d H:i:s"); 
  7. $user = $_GET["name"]; 
  8.  
  9. $sql="INSERT INTO chat(USERNAME,CHATDATE,MSG) " . 
  10.       "values(" . quote($user) . "," . 
  11.       quote($dt) . "," . quote($msg) . ");"; 
  12.  
  13.       echo $sql; 
  14.  
  15. $result = mysql_query($sql); 
  16. if(!$result) 
  17.     throw new Exception('Query failed: ' . mysql_error()); 
  18.     exit(); 

为了接收来自数据库表中所有用户的聊天消息,timer函数被设置为循环5秒调用以下的JavaScript命令,即每隔5秒时间执行get_chat_msg函数。

var t = setInterval(function(){get_chat_msg()},5000);

get_chat_msg是一个基于Ajax的函数。它执行chat_recv_ajax.php程序以获得来自于数据库表的聊天信息。在 onreadystatechange属性中,另一个JavaScript 函数get_chat_msg_result被连接起来。在返回来自于数据库表中的聊天消息的同时,程序控制进入到 get_chat_msg_result函数。


  1. // 
  2. // General Ajax Call 
  3. // 
  4.  
  5. var oxmlHttp; 
  6. var oxmlHttpSend; 
  7.  
  8. function get_chat_msg() 
  9.     if(typeof XMLHttpRequest != "undefined") 
  10.     { 
  11.         oxmlHttp = new XMLHttpRequest(); 
  12.     } 
  13.     else if (window.ActiveXObject) 
  14.     { 
  15.        oxmlHttp = new ActiveXObject("Microsoft.XMLHttp"); 
  16.     } 
  17.     if(oxmlHttp == null) 
  18.     { 
  19.         alert("Browser does not support XML Http Request"); 
  20.        return; 
  21.     } 
  22.  
  23.     oxmlHttp.onreadystatechange = get_chat_msg_result; 
  24.     oxmlHttp.open("GET","chat_recv_ajax.php",true); 
  25.     oxmlHttp.send(null); 

在chat_recv_ajax.php程序中,来自于用户的聊天消息会通过SQL select命令进行收集。为了限制行数,在SQL查询中还给出了限制子句(limit 200),即要求聊天数据库表中的最后200行。所获得的消息再返回给Ajax函数,用于在聊天窗口中显示内容。


  1. require_once('dbconnect.php'); 
  2.  
  3. db_connect(); 
  4.  
  5. $sql = "SELECT *, date_format(chatdate,'%d-%m-%Y %r') 
  6. as cdt from chat order by ID desc limit 200"; 
  7. $sql = "SELECT * FROM (" . $sql . ") as ch order by ID"; 
  8. $result = mysql_query($sql) or die('Query failed: ' . mysql_error()); 
  9.  
  10. // Update Row Information 
  11. $msg=""; 
  12. while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) 
  13.    $msg = $msg . "" . 
  14.         "" . 
  15.         ""; 
  16. $msg=$msg . "<table style="color: blue; font-family: verdana, arial; " . 
  17.   "font-size: 10pt;" border="0"> 
  18.   <tbody><tr><td>" . $line["cdt"] . 
  19.   " </td><td>" . $line["username"] . 
  20.   ": </td><td>" . $line["msg"] . 
  21.   "</td></tr></tbody></table>"; 
  22.  
  23. echo $msg; 
  24.  
  25. 数据准备就绪的同时,JavaScript函数会收集来自于PHP接收到的数据。这些数据将被安排置于DIV标签内。oxmlHttp.responseText会保留从PHP程序接收到的聊天消息,并复制到DIV标签的document.getElementById(“DIV_CHAT”).innerHTML属性。 
  26.  
  27. function get_chat_msg_result(t) 
  28.     if(oxmlHttp.readyState==4  oxmlHttp.readyState=="complete") 
  29.     { 
  30.         if (document.getElementById("DIV_CHAT") != null) 
  31.         { 
  32.             document.getElementById("DIV_CHAT").innerHTML =  oxmlHttp.responseText; 
  33.             oxmlHttp = null; 
  34.         } 
  35.         var scrollDiv = document.getElementById("DIV_CHAT"); 
  36.         scrollDiv.scrollTop = scrollDiv.scrollHeight; 
  37.     } 

下面的SQL CREATE TABLE命令可用于创建名为chat的数据库表。所有由用户输入的信息都会进入到数据库表中。

create table chat( id bigint AUTO_INCREMENT,username varchar(20),
chatdate datetime,msg varchar(500), primary key(id));

兴趣点

这段用于实现聊天应用程序的代码非常有意思。它可以改进成为一个完全成熟的HTTP聊天应用程序。创建该应用程序的逻辑也非常简单。即使是初学者理解起来也不会有任何困难。

许可证

这篇文章,以及任何相关的源代码和文件,都获得了The Code Project Open License (CPOL)的许可。

译文链接:http://www.codeceo.com/article/php-chart-app.html
英文原文:Chat Application in PHP

【责任编辑:wangxueyan TEL:(010)68476606】

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索数据库
, 函数
, 应用程序
, document
, msg
, getelementbyid
, 应用聊天node.jsasp.net
, chat
, php实现聊天室
, query实现ajax
ajax实现实时聊天
jsp实现简单聊天室、js实现简单聊天室、php实现聊天室、php redis实现聊天室、php socket实现聊天室,以便于您获取更多的相关知识。

时间: 2024-12-31 19:01:19

PHP实现最简单的聊天室应用的相关文章

用ASP建立一个简单的聊天室

聊天室|聊天室     经过一个阶段的asp学习,下面我们结合所学过的内容建立一个最简单的聊天室,虽然很简单,但是大家可以通过他来掌握一个聊天室建立的基本过程,并且可以不断的完善其功能. 下面介绍其主要步骤: 1,添加Global.asa文件里面的代码.这部分代码主要处理Application_onStart事件,在此事件中,定义了一个有15个元素的数据,并把它赋给了一个Application对象的属性.Global.asa文件的内容如下. <SCRIPT LANGUAGE="VBScri

Flex和java的socket通信(四)一个简单的聊天室

服务端:java jdk1.5 使用工具:eclipse3.2 客户端:使用工具flex 2 目的:做一个简单的聊天室,用来实现消息广播. 服务端: 客户端:

用nodejs实现一个简单的聊天室

今天我来实现一个简单的聊天室,后台用nodejs, 客户端与服务端通信用socket.io,这是一个比较成熟的websocket框架. 初始工作 安装express, 用这个来托管socket.io,以及静态页面,命令npm install express --save,--save可以使包添加到package.json文件里. 安装socket.io,命令npm install socket.io --save. 编写服务端代码 首先我们通过express来托管网站,并附加到socket.io

Android编写简单的聊天室应用_Android

最近写了一个简单的聊天室应用,可以发送表情,更改头像这些功能.主要技术点就是怎样把表情图片放到textview等Ui控件中展示.这里废话不多说,下面是效果图:  这里主要讲下怎样把文本替换到表情,先说下思路,首先我们的图片是保存在本地资源目录drawable中而所有的资源文件都是R这个类来管理,所以我们可以利用正则表达式找出图片id包装成ImageSpan然后把ImageSpan放到SpannableString中,最后把SpannableString放入edittext中,下面是源码: pac

ASP建立一个简单的聊天室_应用技巧

经过一个阶段的asp学习,下面我们结合所学过的内容建立一个最简单的聊天室,虽然很简单,但是大家可以通过它来掌握一个聊天室建立的基本过程,并且可以不断的完善其功能.下面介绍其主要步骤: 1,添加Global.asa文件里面的代码.这部分代码主要处理Application_onStart事件,在此事件中,定义了一个有15个元素的数据,并把它赋给了一个Application对象的属性.Global.asa文件的内容如下. <SCRIPT LANGUAGE="VBScript" RUNA

Java基于UDP协议实现简单的聊天室程序_java

最近比较闲,一直在抽空回顾一些Java方面的技术应用. 今天没什么事做,基于UDP协议,写了一个非常简单的聊天室程序. 现在的工作,很少用到socket,也算是对Java网络编程方面的一个简单回忆.  先看一下效果:   实现的效果可以说是非常非常简单,但还是可以简单的看到一个实现原理.  "聊天室001"的用户,小红和小绿相互聊了两句,"聊天室002"的小黑无人理会,在一旁寂寞着.  看一下代码实现:  1.首先是消息服务器的实现,功能很简单:•将客户端的信息(进

Android编写简单的聊天室应用

最近写了一个简单的聊天室应用,可以发送表情,更改头像这些功能.主要技术点就是怎样把表情图片放到textview等Ui控件中展示.这里废话不多说,下面是效果图: 这里主要讲下怎样把文本替换到表情,先说下思路,首先我们的图片是保存在本地资源目录drawable中而所有的资源文件都是R这个类来管理,所以我们可以利用正则表达式找出图片id包装成ImageSpan然后把ImageSpan放到SpannableString中,最后把SpannableString放入edittext中,下面是源码: pack

nodejs+socket创建简单的聊天室例子

注:部分引用es6的写法,聊天室很简单,就是创建room,更改名称,简单聊天等功能! 命令:  /nick 用户名    //修改用户名  /join 房间名   //修改房间名称 入口文件server.js const http = require("http"); const fs = require("fs"); const path=require("path"); const mime=require("mime")

一个简单的聊天室源代码!(一)

聊天室|源代码 --chat.asp-- <html> <head><title></title></head> <body> <form method="post" action="RECEIVE.asp">  <input type="hidden" name="content" value><div align=&quo