前些天做了一个聊天室,基于XmlHttpRequest对象,使聊天不会刷新。用XmlDocument对象来保存聊天信息, 并保存至Application对象里面。客户端用Dom来解析聊天信息。Application对象还保存所有用户的所有聊天信息数量,在Session对象里面保存每个会话的聊天数量,每次会话判断Session和Application两个对象中的聊天数量之差X,并从Application中取出后面几条(X),并返回给客户端。
这是聊天的js文件
function CreateXmlRequest() ... {
var xmlhttp_request = false;
try...{
if( window.ActiveXObject )...{
for( var i = 5; i; i-- )...{
try...{
if( i == 2 )...{
xmlhttp_request = new ActiveXObject(
"Microsoft.XMLHTTP" );
}
else...{
xmlhttp_request = new ActiveXObject(
"Msxml2.XMLHTTP." + i + ".0" );
xmlhttp_request.setRequestHeader("Content-Type","text/xml");
xmlhttp_request.setRequestHeader("Content-Type","gb2312");
}
break;
}
catch(e)...{
xmlhttp_request = false;
}
}
}
else if( window.XMLHttpRequest )...{
xmlhttp_request = new XMLHttpRequest();
if (xmlhttp_request.overrideMimeType) ...{
xmlhttp_request.overrideMimeType('text/xml');
}
}
}
catch(e)
...{
xmlhttp_request = false;
}
return xmlhttp_request ;
}
var enterRoom = true ; // 标记用户是否第一次(刚刚)进入聊天室
var isLoadingMsg = true ; // 标记是否已经加载聊天信息
var myrequest = false ;
// 获取聊天信息
function getChatMessage() ... {
isLoadingMsg=false;
myrequest=CreateXmlRequest();
xmlDom=new ActiveXObject("Microsoft.XMLDOM");//获取DOM对象
xmlDom.async=false;//在HTML读取前加载
myrequest.onreadystatechange=showChatMessage;
xmlDomStr="<control>";
xmlDomStr=xmlDomStr+"<enter>"+enterRoom+"</enter>";
xmlDomStr=xmlDomStr+"</control>";
xmlDom.loadXML(xmlDomStr);
enterRoom=false;
myrequest.open("POST","getXMLMessage.aspx?myDate="+new
Date().getTime(),true);
myrequest.send(xmlDom);
}
// 显示聊天信息
function showChatMessage() ... {
if(myrequest.readyState==4 )...{
if(myrequest.status==200)...{
isLoadingMsg=true;
var myDom=myrequest.responseText;//获取返回XML数据
msgDom=new ActiveXObject("Microsoft.XMLDOM");
var msgDom=myrequest.responseXML;
msgDom.loadXML(myDom);
var strMessage="";
//(msgDom!=null)&&
if(myDom!="")...{
var
messageNodes=msgDom.getElementsByTagName("message"); //获取所有message的结点
var chatmsgs=document.getElementById("ChatMessages");
orgMsg=chatmsgs.innerHTML;//获取原来的聊天信息
for(i=0;i<messageNodes.length;i++)...{
msgNode=messageNodes(i);//获取message的结点
//获取message结点下的元素
objText=msgNode.selectSingleNode("text").text;
objText=Check(objText);
objUser=msgNode.selectSingleNode("user").text;
objfont=msgNode.selectSingleNode("fontface").text;
objsize=msgNode.selectSingleNode("fontsize").text;
objColor=msgNode.selectSingleNode("color").text;
strMessage=strMessage+"<font face="+objfont+" size="+objsize+"
color="+objColor+"><B>"+objUser+"</B>:"+objText+"</font><br>";
}
if(strMessage!="")...{
strMessage=orgMsg+strMessage;
document.getElementById("ChatMessages").innerHTML=strMessage;//累加
}
//chatmsgs.scrollIntoView(false);//窗口滚动为false;
}
}
}
}
// 更新消息
function updatechatMessage() ... {
var chatmsg=document.getElementById("chatmsg");
var checkedValue=chatmsg.value;
var username=document.getElementById("username").value;
if(checkedValue=="")...{
errorToolTip("chatmsg","内容");
return;
}
if(username=="")...{
errorToolTip("username","用户名");
return;
}
var color=document.getElementById("msgcolor").value;
var fontsize=document.getElementById("chatFontSize").value;
var fontface=document.getElementById("chatFont").value;
if(chatmsg.value!="")...{
var strMessage=checkedValue;
sendrequest=CreateXmlRequest();
xmlDom=new ActiveXObject("Microsoft.XMLDOM");//获取DOM对象
xmlDom.async=false;
xmlDomStr="<message>";
xmlDomStr=xmlDomStr+"<text>"+strMessage+"</text>";//获取发送的消息
xmlDomStr=xmlDomStr+"<user>"+username+"</user>";//用户名
xmlDomStr=xmlDomStr+"<fontsize>"+fontsize+"</fontsize>";
xmlDomStr=xmlDomStr+"<fontface>"+fontface+"</fontface>";
xmlDomStr=xmlDomStr+"<color>"+color+"</color>";
xmlDomStr=xmlDomStr+"</message>";
xmlDom.loadXML(xmlDomStr);
sendrequest.onreadystatechange=getCountMsg;
sendrequest.open("POST","updateXMLMessage.aspx",true);
sendrequest.send(xmlDom);
chatmsg.value="";//清空输入框
}
}
// 获取消息数量
function getCountMsg() ... {
if(sendrequest.readyState==4 )...{
if(sendrequest.status==200)...{
//document.getElementById("countMsg").innerHTML=sendrequest.responseText
;
}
}
}
var oPopup = window.createPopup();
function errorToolTip(obj,obj2)
... {
/**//*500 80*/
var mytool=document.getElementById(obj);
var toolTop= mytool.offsetTop;
var toolLeft= mytool.offsetLeft+82;
oPopup.document.body.innerHTML
="<div><center><img src="/ShavelingChat/images/info.gif
"></img></center><br><color=red>"+obj2+"不能为空!</color></div>";
oPopup.show(toolLeft,toolTop , 80,80,
chatmsg);
}
function Check(mytext) ... {
var myvalue=ChangeFaceNoToImage(mytext);
var reImg= new RegExp("(gif|jpg|png|jpeg|bmp)$", "");
var isImg = reImg.test(myvalue);
var reUrl=new RegExp("http://([/w-]+/.)+[/w-]+(/[/w-
./?%&=]*)?", "");
var isUrl = reUrl.test(myvalue);
if(isImg==true && isUrl==true)...{
// [!CDATA[ ]>
myvalue="<img src="+myvalue+"></img>";
}
return myvalue;
}
// 把表情代码转为图象
function ChangeFaceNoToImage(ChatWord)
... {
for (var i = 0;i < 90;i ++)
...{
var changeStr = "<img src="images/face/" + i + ".gif">";
var pattern = new RegExp("/[face" + i + "/]");
pattern.global = true;
while (pattern.test(ChatWord))
...{
ChatWord = ChatWord.replace(pattern,changeStr);
}
}
return ChatWord;
}
// 添加表情
function AddFace(FaceNo)
... {
document.getElementById("chatmsg").value += FaceNo;
GetFocus();
HideDiv();
}
// 聊天输入框聚焦
function GetFocus()
... {
document.getElementById("chatmsg").focus();
}
// 获取表情
function Getface() ... {
var btnLeft=document.getElementById("faceBox").style.left;
var tem=1;
var falg=0;
for(j=0;j<90;j++)...{
falg=falg+1;
if(falg>10)...{
tem=tem+1;
falg=1;
}
document.getElementById("Face"+tem).innerHTML +=
"<img src="images/face/" + j + ".gif"
οnclick="javascript:AddFace('[face" + j + "]');"
οnmοuseοut="javascript:this.style.border ='0';"
οnmοuseοver="javascript:this.style.border ='1px solid';" alt="点击插
入表情"/> ";
}
var handle=document.getElementById("faceBox");
var pos = getPosition(handle);
var t = pos.top;
var l = pos.left;
document.getElementById("mydownDiv").style.left=l-200;
document.getElementById("mydownDiv").style.top=t+22;
document.getElementById("mydownDiv").style.display="";
}
function HideDiv() ... {
document.getElementById("mydownDiv").style.display="none";
}
function MyHideMsg() ... {
if(document.getElementById("mydownDiv").style.display=="")...{
document.getElementById("mydownDiv").style.display="none";
}
}
// 获取对象的坐标
function getPosition(Obj)
... {
var sumTop=0;
var sumLeft=0;
while(Obj!=window.document.body) ...{
sumTop+=Obj.offsetTop;
if(Obj.tagName.toLowerCase()=='div') ...{
sumTop-=Obj.scrollTop;
}
sumLeft+=Obj.offsetLeft;
Obj=Obj.offsetParent;
}
return ...{left:sumLeft,top:sumTop}
}
这是ShavelingChat.html页面,这个页面杂杂的,其中有一段js代码是我用来访问Sina的Rss订阅获取当天的国内新闻,那段代码可以不用。因为我客户端处理Dom的时候有点问题,只能本地可以访问,其它机子连到主机就访问不了,只要把Dom对象弄成new ActiveXObject("Microsoft.XMLDOM");这个对象就可
< html xmlns ="http://www.w3.org/1999/xhtml" >
< HEAD >
< title > asp.net javascript blog ajax 学习 视频 --聊天室 </ title >
< script language ="javascript" src ="/ShavelingChat/js/chat.js" ></ script >
< style type ="text/css" > <!-- #Layer1 { position : absolute ; left : 319px ; top : 158px ; width : 537px ; height : 298px ; z-index : 1 ; background-color : #CCCCCC ; }
#Layer2 { position : absolute ; left : 277px ; top : 106px ; width : 189px ; height : 155px ; z-index : 1 ; background-image : url(images/leftye.gif) ; }
#Layer3 { position : absolute ; left : 301px ; top : 159px ; width : 546px ; height : 274px ; z-index : 2 ; }
#Layer4 { position : absolute ; left : 314px ; top : 158px ; width : 547px ; height : 300px ; z-index : 2 ; }
#ChatMessages { OVERFLOW : auto ; position : absolute ; left : 282px ; top : 146px ; width : 613px ; height : 318px ; z-index : 2 ; }
#Layer6 { position : absolute ; left : 715px ; top : 105px ; width : 183px ; height : 151px ; z-index : 3 ; background-image : url(images/rightye.gif) ; }
#Layer7 { position : absolute ; left : 467px ; top : 107px ; width : 245px ; height : 36px ; z-index : 4 ; }
#Layer5 { position : absolute ; left : 68px ; top : 117px ; width : 166px ; height : 176px ; z-index : 5 ; background-image : url(images/heshang.gif) ; }
#Layer8 { position : absolute ; left : 49px ; top : 26px ; width : 200px ; height : 60px ; z-index : 6 ; background-image : url(images/heshang1.gif) ; }
#Layer9 { position : absolute ; left : 47px ; top : 26px ; width : 163px ; height : 49px ; z-index : 6 ; background-image : url(images/email_lqsocke.gif) ; }
#myRssReader { position : absolute ; overflow : hidden ; left : 300px ; top : 1px ; width : 599px ; height : 96px ; z-index : 7 ; }
#Layer10 { position : absolute ; left : 16px ; top : 674px ; width : 872px ; height : 60px ; z-index : 12001 ; }
--> </ style >
</ HEAD >
< BODY leftMargin ="0" topMargin ="0" onload ="Getface()" marginheight ="0" marginwidth ="0"
width ="100%" >
< div id ="Layer2" ></ div >
< FONT face ="宋体" ></ FONT >
< div id ="Layer10" >
< P >
系统提示: < br >
1.您可以复制网上图片的URL地址,发送这个URL地址,会自动帮你解析该图片地址,显示出来! < br >
2.上面的新闻信息,是访问新浪的RSS新闻订阅,涉及到跨站点访问,IE会自动提示! < BR />
3.按Ctrl+回车可发送消息!
</ P >
</ div >
< FONT face ="宋体" ></ FONT >< FONT face ="宋体" ></ FONT >< FONT face ="宋体" ></ FONT >
< div id ="Layer5" ></ div >
< div id ="Layer9" ></ div >
< div id ="myRssReader" ></ div >
< div id ="ChatMessages" >< font size ="8" ></ font ></ div >
< div id ="Layer6" ></ div >
< div id ="Layer7" > 用户名: < input id ="username" type ="text" size ="9" name ="text" >
</ div >
< TABLE id ="Table1" height ="97" cellSpacing ="0" cellPadding ="0" width ="100%" background ="images/menu_bg.gif"
border ="0" >
< TBODY >
< TR >
< TD >
< TABLE id ="Table2" cellSpacing ="0" cellPadding ="0" width ="900" border ="0" >
< TBODY >
< TR >
< TD width ="298" >< IMG src ="images/logo.gif" border ="0" ></ TD >
< TD vAlign ="top" align ="left" width ="602" > </ TD >
</ TR >
</ TBODY ></ TABLE >
</ TD >
</ TR >
</ TBODY ></ TABLE >
< TABLE id ="Table3" height ="575" cellSpacing ="0" cellPadding ="0" width ="100%" background ="images/kkk_13.gif"
border ="0" >
< TBODY >
< TR >
< TD vAlign ="top" >
< TABLE id ="Table4" cellSpacing ="0" cellPadding ="0" width ="1000" border ="0" >
< TBODY >
< TR >
< TD width ="276" >< IMG src ="images/img01.gif" border ="0" ></ TD >
< TD vAlign ="bottom" width ="624" >
< TABLE id ="Table5" cellSpacing ="0" cellPadding ="0" width ="624" border ="0" >
<!-- DWLayoutTable -->
< TBODY >
< TR >
< TD width ="624" height ="362" > </ TD >
</ TR >
< TR >
< TD vAlign ="top" height ="37" >
< table id ="Table6" cellSpacing ="0" cellPadding ="0" width ="100%" border ="0" >
<!-- DWLayoutTable -->
< tr align ="center" >
< td width ="624" height ="37" > 字体:
< SELECT id ="chatFont" name ="chatFont" >
< option value ="宋体" selected > 宋体 </ option >
< option value ="仿宋体" > 仿宋体 </ option >
< option value ="楷体" > 楷体 </ option >
< option value ="黑体" > 黑体 </ option >
</ SELECT > < input type ="button" value ="清屏" onclick ="clearMsg()" > 颜色:
< SELECT id ="msgcolor" name ="usercolor" >
< option value ="red" selected > 红色 </ option >
< option value ="yellow" > 黄色 </ option >
< option value ="green" > 绿色 </ option >
< option value ="blue" > 蓝色 </ option >
</ SELECT >
字号:
< SELECT id ="chatFontSize" name ="chatFontSize" >
< option value ="4pt" selected > 4 </ option >
< option value ="5pt" > 5 </ option >
< option value ="6pt" > 6 </ option >
< option value ="7pt" > 7 </ option >
< option value ="8pt" > 8 </ option >
< option value ="9pt" > 9 </ option >
< option value ="10pt" > 10 </ option >
</ SELECT > < input id ="faceBox" onclick ="Getface()" type ="button" value ="表情" name ="faceBox" ></ td >
</ tr >
</ table >
</ TD >
</ TR >
< TR >
< TD align ="left" >
< TABLE id ="Table7" cellSpacing ="0" cellPadding ="0" border ="0" >
<!-- DWLayoutTable -->
< TBODY >
< TR >
< TD height ="97" >< IMG src ="images/tourist-01.gif" border ="0" ></ TD >
< TD ></ TD >
< TD >< IMG src ="images/line-point.gif" border ="0" ></ TD >
< TD ></ TD >
< TD ></ TD >
< td vAlign ="top" width ="587" >
< table id ="Table8" cellSpacing ="0" cellPadding ="0" width ="100%" border ="0" >
<!-- DWLayoutTable -->
< tr >
< td vAlign ="bottom" align ="left" width ="587" height ="97" > < textarea id ="chatmsg" style ="WIDTH: 500px; HEIGHT: 80px" name ="chatmsg" onKeyDown ="submitMsg()"
onclick ="MyHideMsg()" ></ textarea >< INPUT id ="Button1" onclick ="updatechatMessage()" type ="button" value ="发送" name ="Send" ></ td >
</ tr >
</ table >
</ td >
</ TR >
</ TBODY ></ TABLE >
</ TD >
</ TR >
< TR >
< TD >< IMG src ="images/notice-bottom.gif" align ="bottom" border ="0" ></ TD >
</ TR >
</ TBODY ></ TABLE >
</ TD >
< TD vAlign ="top" >
< TABLE id ="Table9" cellSpacing ="0" cellPadding ="0" border ="0" >
< TBODY >
< TR >
< TD height ="92" ></ TD >
</ TR >
< TR >
< TD ></ TD >
</ TR >
< TR >
< TD ></ TD >
</ TR >
< TR >
< TD ></ TD >
</ TR >
< TR >
< TD ></ TD >
</ TR >
< TR >
< TD width ="92" ></ TD >
</ TR >
</ TBODY ></ TABLE >
</ TD >
</ TR >
</ TBODY ></ TABLE >
</ TD >
</ TR >
</ TBODY ></ TABLE >
< TABLE id ="Table10" cellSpacing ="0" cellPadding ="0" width ="100%" border ="0" >
< TBODY >
< TR >
< TD background ="images/bottombgcol.gif" border ="0" >
< TABLE id ="Table11" cellSpacing ="0" cellPadding ="0" width ="1000" border ="0" >
< TBODY >
< TR >
< TD >< IMG src ="images/bottom.gif" border ="0" ></ TD >
</ TR >
</ TBODY ></ TABLE >
</ TD >
</ TR >
</ TBODY ></ TABLE >
< script event ="onLoad" for ="window" >
document.getElementById( " myRssReader " ).innerHTML = " <center> " + " <img src="/ShavelingChat/images/scrll.gif "></img> " + " <br>使用新浪的RSS订阅!</center> " ;
ShowRSS();
setInterval( " getChatMessage() " , 100 );
document.getElementById( " ChatMessages " ).innerHTML = " <B>和尚洗漂柔-聊天室:欢迎您光临!<br> " ;
// document.getElementById("myRssReader").innerHTML="<center><input type=button value="单击获取新浪的RSS订阅!" οnclick="javascript:ShowSinaNews();"></center>";
// ShowRSS();
</ script >
< script language ="javascript" >
function ShowSinaNews(){
ShowRSS();
}
</ script >
< div id ="mydownDiv" style ="BORDER-RIGHT: #333333 2px solid; PADDING-RIGHT: 4px; BORDER-TOP: #333333 2px solid; DISPLAY: none; PADDING-LEFT: 4px; LEFT: 600px; OVERFLOW-X: hidden; PADDING-BOTTOM: 4px; SCROLLBAR-HIGHLIGHT-COLOR: #9999cc; OVERFLOW: scroll; BORDER-LEFT: #333333 2px solid; WIDTH: 300px; SCROLLBAR-ARROW-COLOR: white; PADDING-TOP: 4px; BORDER-BOTTOM: black 2px solid; SCROLLBAR-BASE-COLOR: #cccccc; POSITION: absolute; TOP: 342px; HEIGHT: 180px; BACKGROUND-COLOR: #e4e4e4" >
< table id ="mytable" onblur ="HideDiv();" height ="300" width ="250" border ="0" >
< tr >
< td >
< div id ="face1" ></ div >
</ td >
</ tr >
< tr >
< td >
< div id ="face2" ></ div >
</ td >
</ tr >
< tr >
< td >
< div id ="face3" >< FONT face ="宋体" ></ FONT ></ div >
</ td >
</ tr >
< tr >
< td >
< div id ="face4" ></ div >
</ td >
</ tr >
< tr >
< td >
< div id ="face5" ></ div >
</ td >
</ tr >
< tr >
< td >
< div id ="face6" ></ div >
</ td >
</ tr >
< tr >
< td >
< div id ="face7" ></ div >
</ td >
</ tr >
< tr >
< td >
< div id ="face8" ></ div >
</ td >
</ tr >
< tr >
< td >
< div id ="face9" ></ div >
</ td >
</ tr >
</ table >
</ div >
< div id ="doing" style ="Z-INDEX: 12000; LEFT: 0px; VISIBILITY: hidden; WIDTH: 100%; CURSOR: wait; POSITION: absolute; TOP: 0px; HEIGHT: 100%"
runat ="server" >
< table id ="myRssTable" height ="100%" width ="100%" >
< tr vAlign ="middle" align ="center" >
< td >
< table id ="Table13" style ="FILTER: Alpha(Opacity=75); WIDTH: 169px; HEIGHT: 62px" height ="62"
width ="169" bgColor ="#99cccc" >
< tr vAlign ="middle" align ="center" >
< td >
< div id ="mymessage" > 正在访问新浪RSS新闻订阅... </ div >
. < br >
< IMG alt ="loading...." src ="/ShavelingChat/images/loading.gif" align ="middle" border ="0" > . </ td >
</ tr >
</ table >
</ td >
</ tr >
</ table >
</ div >
< script >
var xmlHttp;
function ShowRSS() {
var target = " http://rss.sina.com.cn/news/marquee/ddt.xml " ;
readRSS(target);
}
function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject( " Microsoft.XMLHTTP " );
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
function readRSS(url) {
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open( " GET " , url, true );
xmlHttp.send( null );
}
function handleStateChange() {
if (xmlHttp.readyState == 1 ) {
var divc = document.getElementById( " myRssTable " );
document.getElementById( " myRssReader " ).innerHTML = divc.innerHTML;
}
if (xmlHttp.readyState == 4 ) {
if (xmlHttp.status == 200 ) {
clearPreviousResults();
parseResults();
}
}
}
function clearPreviousResults() {
var ListBody = document.getElementById( " myRssReader " );
while (ListBody.childNodes.length > 0 ) {
ListBody.removeChild(ListBody.childNodes[ 0 ]);
}
}
function parseResults() {
var results = new ActiveXObject( " Microsoft.XMLDOM " );
results = xmlHttp.responseXML;
var title = null ;
var link = null ;
var item = null ;
var items = results.getElementsByTagName( " item " );
var allNews = "" ;
var partNews = "" ;
for ( var i = 0 ; i < items.length; i ++ ) {
item = items[i];
partNews = "" ;
title = item.getElementsByTagName( " title " )[ 0 ].firstChild.nodeValue;
link = item.getElementsByTagName( " link " )[ 0 ].firstChild.nodeValue;
partNews = partNews + " <a href= " + link + " > " + title + " </a></br> "
allNews = allNews + partNews;
}
allNews = " <MARQUEE οnmοuseοver=this.stop() οnmοuseοut=this.start() scrollAmount=1 scrollDelay=80 direction=up> " + allNews + " </MARQUEE> " ;
document.getElementById( " myRssReader " ).innerHTML = allNews;
}
</ script >
< script >
function submitMsg(){
if (event.ctrlKey && event.keyCode == 13 ){
updatechatMessage();
}
}
function clearMsg(){
document.getElementById( " ChatMessages " ).innerHTML = "" ;
}
</ script >
</ BODY >
</ html >
这个getXMLMessage.aspx的页面,这个页面用来接收客户端的请求,返回该用户在Application对象中没有的聊天信息的XML片段。
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Xml;
namespace ShavelingChat
... {
/**//// <summary>
/// getXMLMessage 的摘要说明。
/// </summary>
public class getXMLMessage : System.Web.UI.Page
...{
private void Page_Load(object sender, System.EventArgs e)
...{
if(!IsPostBack)
...{
//Application中的Xml
XmlDocument serverXml=(XmlDocument)Application["serverMsg"];
//客户端的XML
XmlDocument clientXml=new XmlDocument ();
clientXml.Load(Request.InputStream);
//获取用户是否刚进入
string isEnter=clientXml.DocumentElement.SelectSingleNode("enter").InnerText;//FirstChild.Value;
//如果是第一次进入,则添加系统的消息
if((isEnter=="true"||isEnter.Equals("true")))
...{
string systemMsg="<message>";
systemMsg+="<text>系统信息:欢迎您来到和尚洗漂柔聊天室,祝您聊得天心!</text>";
systemMsg+="<user>管理员</user>";
systemMsg+="<fontface>宋体</fontface>";
systemMsg+="<fontsize>5pt</fontsize>";
systemMsg+="<color>Red</color>";
systemMsg+="</message>";
XmlDocument tempXml=new XmlDocument ();
tempXml.LoadXml(systemMsg);
XmlNode msg=serverXml.ImportNode(tempXml.DocumentElement,true);
serverXml.DocumentElement.AppendChild(msg);
Application["serverMsg"]=serverXml;
Session["clientLine"]=1;
}
string myxml=" ";
int clientLine=Convert.ToInt32(Session["clientLine"]);
int serverLine=serverXml.DocumentElement.SelectNodes("message").Count;
if(clientLine<serverLine)
...{
XmlNodeList allServerList=serverXml.DocumentElement.SelectNodes("message");
for(;clientLine<serverLine;clientLine++)
...{
myxml+="<message>"+allServerList[clientLine].InnerXml+"</message>";
}
myxml="<chatroom>"+myxml+"</chatroom>";
Session["clientLine"]=serverLine;//重置消息总数
}
Response.Write (myxml);
Response.End();
}
}
Web 窗体设计器生成的代码#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
...{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/**//// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
...{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
这个是updateXMLMessage.aspx页面,用来将用户发送的消息,添加到Application对象中。
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Xml;
using System.IO;
namespace ShavelingChat
... {
/**//// <summary>
/// updateXMLMessage 的摘要说明。
/// </summary>
public class updateXMLMessage : System.Web.UI.Page
...{
private void Page_Load(object sender, System.EventArgs e)
...{
if(!IsPostBack)
...{
//客户端的XML
XmlDocument clientXml=new XmlDocument ();
clientXml.Load(Request.InputStream);
XmlDocument serverXml=(XmlDocument)Application["serverMsg"];
string clientStr=clientXml.InnerXml;
XmlDocument tempDoc=new XmlDocument ();
tempDoc.LoadXml(clientStr);
XmlNode msg=serverXml.ImportNode(tempDoc.DocumentElement,true);
serverXml.DocumentElement.AppendChild(msg);
Application["serverMsg"]=serverXml;
}
}
Web 窗体设计器生成的代码#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
...{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/**//// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
...{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
最后在Global.asax.cs这个页面中添加如下代码用于实使化该聊天信息的XmlDocument对象,当然也不一定要在这里做。。。
{
XmlDocument dom = new XmlDocument ();
string appMsg = " <chatroom></chatroom> " ;
dom.LoadXml(appMsg);
Application[ " serverMsg " ] = dom;
}
最后还有一段访问Rss的新闻订阅的代码贴一下。。。
function ShowRSS() {
var target = " http://rss.sina.com.cn/news/marquee/ddt.xml " ;
readRSS(target);
}
function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject( " Microsoft.XMLHTTP " );
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
function readRSS(url) {
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open( " GET " , url, true );
xmlHttp.send( null );
}
function handleStateChange() {
/*
if(xmlHttp.readyState == 1) {
var divc=document.getElementById("myRssTable");
document.getElementById("myRssReader").innerHTML = divc.innerHTML;
}
*/
if (xmlHttp.readyState == 4 ) {
if (xmlHttp.status == 200 ) {
// clearPreviousResults();
// parseResults();
}
}
}
function clearPreviousResults() {
var ListBody = document.getElementById( " myRssReader " );
while (ListBody.childNodes.length > 0 ) {
ListBody.removeChild(ListBody.childNodes[ 0 ]);
}
}
function parseResults() {
alert( " go to this " );
var results = new ActiveXObject( " Microsoft.XMLDOM " );
results = xmlHttp.responseXML;
var title = null ;
var link = null ;
var item = null ;
var items = results.getElementsByTagName( " item " );
var allNews = "" ;
var partNews = "" ;
for ( var i = 0 ; i < items.length; i ++ ) {
item = items[i];
partNews = "" ;
title = item.getElementsByTagName( " title " )[ 0 ].firstChild.nodeValue;
alert(title);
link = item.getElementsByTagName( " link " )[ 0 ].firstChild.nodeValue;
partNews = partNews + " <a href= " + link + " > " + title + " </a></br> "
allNews = allNews + partNews;
}
allNews = " <MARQUEE οnmοuseοver=this.stop() οnmοuseοut=this.start() scrollAmount=1 scrollDelay=80 direction=up> " + allNews + " </MARQUEE> " ;
document.getElementById( " myRssReader " ).innerHTML = allNews;
}
总结:以目前这些代码只适合很小型的聊天,因为代码中还有很多Bug.我有测试过30台机子一起连上的时候,定时访问服务器SetInteval就要设计为2000也就是两秒访问一次,还有Application没有定时清掉那些消息,因为聊天信息越来越多,Application对象就会慢慢膨涨,服务器负担也会变大,还有那个表情做得不太好,每次点一下都要先加载图片,所以点一下要等一两秒才出来,其实把那个放到全局变量就可以解决了。就写到这了。。开会去了。