网页在线聊天-宁剑

《网页在线聊天-宁剑》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、装订线本科生学年论文（设计）题目：基于C/S模式的网页在线聊天室学院计算机科学与技术学院专业xxxxxxxxxxxxxxxx学号xxxxxxxxxxx姓名宁剑指导教师xxxxxx20xx年x月xx日基于C/S模式的网页在线聊天室摘要早期的应用软件系统大都采用C/S（客户机/服务器）结构，但是具有数据安全性低，数据不一致，实时性差，系统更新不便等劣势。随着网络信息化的不断发展，B/S（浏览器/服务器）结构得到了大规模的应用，成为未来软件发展的趋势。同时，随着Ajax技术的发展，能够让在线应用体验像本地应用一样流畅。这无疑又掀起了一场互联网革命。OSI是

2、OpenSystemInterconnection的缩写，意为开放式系统互联。国际标准化组织（ISO）制定了OSI模型。这个模型把网络通信的工作分为7层，分别是物理层、数据链路层、网络层、传输层、会话层、表示层和应用层。本次实验所做的基于C/S模式的网页在线聊天室运用了Ajax技术，可以实现异步传输和动态加载数据，同时用HTML+CSS+JavaScript的前端技术，加上PHP后端服务器脚本语言编写。虽然用到的东西很多，不过都十分简单，代码精简，易于读者理解软件的实现和网络信息的传递。关键词：C/S异步在线聊天室OSI/RM目录一、实验目的…………

3、…………………………………………1二、实验内容……………………………………………………1三、实验分析……………………………………………………1四、具体实现……………………………………………………3五、心得体会……………………………………………………12六、附录……………………………………………………12一、实验目的为了进一步加强学生对于OSI网络模型结构的理解，同时希望加强学生的应用能力和自主创新能力。二、实验内容制作一个在线聊天工具，实现方式不限，要求必须实现基本的聊天，理解信息在网络上的传输。三、实验分析本次实验是制作一个聊天工具，目的在于加深对

4、于网络结构模型的理解，但是该软件的实现方式不限。由于最近刚学了后端PHP语言和前端的JavaScript语言，同时又了解了Ajax的特性，于是结合自身所学，决定用一个简单网页去实现这个聊天室。Ajax工作流程示意图：-16-Ajax传输数据方式示意图：浏览器服务器用户活动Ajax引擎活动异步请求异步响应AJAX即“AsynchronousJavaScriptAndXML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。AJAX=异步JavaScript和XML（标准通用标记语言的子集）。AJAX是一种用于创建快速动态网

5、页的技术。通过在后台与服务器进行少量数据交换，AJAX可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用AJAX）如果需要更新内容，必须重载整个网页页面。Ajax的核心是JavaScript对象XMLHttpRequest。该对象在InternetExplorer5中首次引入，它是一种支持异步请求的技术。简而言之，XMLHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。聊天室信息流程：服务器浏览器-16-一、具体实现异步发送请求是Ajax最为核心的

6、内容，Ajax使用XMLHttpRequest对象异步发送请求，代码如下：functioncreateXMLHttpRequest(){if(window.XMLHttpRequest){XMLHttpReq=newXMLHttpRequest();}elseif(window.ActiveXObject){try{XMLHttpReq=newActiveXObject("Msxml2.XMLHTTP");}catch(e){try{XMLHttpReq=newActiveXObject("Microsoft.XMLHTTP");}catch(e){

7、}}}else{}}上面的程序可以在IE、Firefox、Opera等浏览器中创建XMLHttpRequest对象。由于XMLHttpRequest在不同的浏览器中实现方式的不同，因而在不同的浏览器中创建XMLHttpRequest的方式略有差异。-16-一旦XMLHttpRequest对象创建成功，就可以使用XMLHttpRequest发送请求，通过JavaScript代码完成，代码如下：functionsendRequest(){varchatMsg=document.getElementById('chatMsg').value;varurl=

8、"index.php";createXMLHttpRequest();XMLHttpReq.open("PO