网页在线聊天-宁剑讲述.doc

本科生学年论文（设计） 题目： 基于C/S模式的网页在线聊天室 学 院 计算机科学与技术学院 专 业 xxxxxxxxxxxxxxxx 学 号 xxxxxxxxxxx 姓 名 宁剑 指导教师 xxxxxx 20xx年x月xx日 基于C/S模式的网页在线聊天室 摘 要 早期的应用软件系统大都采用C/S（客户机/服务器）结构，但是具有数据安全性低，数据不一致，实时性差，系统更新不便等劣势。随着网络信息化的不断发展 AJAX即“Asynchronous JavaScript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。AJAX = 异步 JavaScript和XML（标准通用标记语言的子集）。AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。 传统的网页（不使用 AJAX）如果需要更新内容，必须重载整个网页页面。 Ajax 的核心是 JavaScript 对象 XMLHttpRequest。该对象在 Internet Explorer 5 中首次引入，它是一种支持异步请求的技术。简而言之，XMLHttpRequest 使您可以使用 JavaScript 向服务器提出请求并处理响应，而不阻塞用户。 聊天室信息流程： 具体实现 异步发送请求是Ajax最为核心的内容，Ajax使用XMLHttpRequest对象异步发送请求，代码如下： function createXMLHttpRequest() { if(window.XMLHttpRequest) { XMLHttpReq = new XMLHttpRequest(); } else if(window.ActiveXObject) { try { XMLHttpReq = new ActiveXObject(Msxml2.XMLHTTP); } catch(e) { try { XMLHttpReq = new ActiveXObject(Microsoft.XMLHTTP); } catch(e) { } } } else { } } 上面的程序可以在IE、Firefox、Opera等浏览器中创建XMLHttpRequest对象。由于XMLHttpRequest在不同的浏览器中实现方式的不同，因而在不同的浏览器中创建XMLHttpRequest的方式略有差异。 一旦XMLHttpRequest对象创建成功，就可以使用XMLHttpRequest发送请求，通过JavaScript代码完成，代码如下： function sendRequest() { var chatMsg = document.getElementById(chatMsg).value; var url = index.php; createXMLHttpRequest(); XMLHttpReq.open(POST,url,true); XMLHttpReq.setRequestHeader(Content-Type,application/x-www-form-urlencoded); XMLHttpReq.onreadystatechange = processResponse; document.getElementById(chatMsg).value = ; XMLHttpReq.send(chatMsg= + chatMsg); } XMLHttpRequest对象有以下几个内置方法：通过open方法取得与服务器连接，发送POST请求；通过setRequestHeader方法设置合适的请求头，让服务器识别所发送过来的数据；通过onreadystatechange方法指定回调函数，当信息从服务器传回时，将自动调用其指定的函数，相当于一个事件监听器；通过调用send方法发送请求。 此外，发送信息时应该在按下“SEND”按钮或回车键时发送，故在img src = “send.jpg”/标签中加入这样一行命令，加入后如右所示：img src=send.jpg onClick=javascript:sen