Asp.Net制作聊天室（显示在线用户列表，禁止发言，允许发言，踢出聊天室，退出聊天室）

isiqi

浏览: 16465669 次
性别:
来自: 济南

最近访客更多访客>>

nison

hellohank

wangyy

devcang

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

2012-07 ( 335)
2012-06 ( 252)
2012-05 ( 362)
更多存档...

ASP.net ASP .net CSS fckeditor

最近做一个项目，需要一个聊天室所以就做了，因为是第一次做，而且也不清楚别人聊天室是怎么做的，只能闭门造车了，憋了一周多才做出来，而且还有很多地方不太完美。在此贴出来，希望大家多多指点。聊天室的基本效果如下：

1、资源文件：
有主页面OnlineCommunication.aspx，显示聊天信息的页面ShowMessage.aspx。又用到FCKeditors编辑器

2、主要变量：
Application["Message"]用来存储聊天信息
Session["LogonName"]用来存储在线用户名
Application["OnLine"]用来存储各个在线用户名和该用户的状态。组成形式例如：板凳,0|可可儿,1|网虫,0|（第一部分为用户名，后面为状态码-1离线，0可发言，1禁止发言）
Session["MsgSubLength"]记录要截取字符串的长度，因为每个人刚刚进来时看不到别人的发言，所以用户进来首先要判断当前聊天内容的长度，然后截取掉。

3、不爽之处：
(1)、用到了微软自带的AJAX局部更新UpdatePanel控件和Timer1控件，感觉不是很爽，能够看到闪烁
(2)、显示聊天信息页面ShowMessage.aspx里，增加了定时刷新来显示聊天内容，如下所示。虽然我把他放到一个框架里了，但框架里子页面的刷新，父页面也跟着定时刷新，很是不爽
 <meta http-equiv="REFRESH" content="12,ShowMessage.aspx"/>
如果有时间重新写下这个聊天室，不用微软自带的AJAX控件估计会好些。
4、如何让滚动条自动移动到最下面

如果聊天内容太多会出现垂直滚动条，默认滚动条始终是在上面，那如何让滚动条自动移动到最下面呢，我试验了很多办法，都不太好使，最终用了以下办法。在body里，增加代码onload="var t = document.getElementById('chatMessage'); t.scrollTop = t.scrollHeight;"来控制一个DIV。

.chatMsg{

width:690px;

height:280px;

border:#eee solid 1px;

overflow:scroll;

}

</style>

</head>

</form>

</body>

</html>

奇怪的是这个办法，如果配合微软的Ajax局部更新UpdatePanel控件却不好使，只能在Head区里加代码来刷新整个页面才可以<meta http-equiv="REFRESH" content="12,ShowMessage.aspx"/>。实在郁闷。

下面贴下我的垃圾代码吧：
OnlineCommunication.aspx代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="OnlineCommunication.aspx.cs" ValidateRequest="false" Inherits="HuiYingWeb.Content.OnlineCommunication" %> <%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>中国民族证券--延吉营业部</title> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1"> .STYLE1 { font-size: 9px; width: 100%; } body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; } .style1 { width: 100%; } </style> <link href="../Style/Style.css" mce_href="Style/Style.css" rel="stylesheet" type="text/css" /> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"> </asp:ScriptManager> <table width="1001" border="0" align="center" cellpadding="0" cellspacing="0">  <tr> <td align="left" valign="top"> <table width="999" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="30"> <b>中国民族证券延吉营业部 <br /> China Minzu Securities YanJi Sales Department</b> </td> <td> </td> <td align="right" valign="bottom"> 用户名：<asp:Label ID="lblUserName" runat="server"></asp:Label> 会员等级：<asp:Label ID="lblUserRoleName" runat="server"></asp:Label> <a href="../Admin/Main.aspx" mce_href="Admin/Main.aspx" runat="server" id="admin" visible="false">后台管理</a> <a href="index.aspx" mce_href="index.aspx">返回首页</a> <a href="LoginOut.aspx" mce_href="LoginOut.aspx">退出登录</a> </td> </tr> <tr> <td height="12" colspan="3"> <img src="../images/zhengquanshouye_06.gif" mce_src="images/zhengquanshouye_06.gif" width="1001" height="15" /> </td> </tr> </table> </td> </tr> <tr> <td width="998" valign="top">  <table cellspacing="0" class="style1"> <tr> <asp:UpdatePanel ID="UpdatePanel1" ChildrenAsTriggers="True" runat="server"> <ContentTemplate > <td valign="top"> <iframe name="chat" src="http://localhost:1851/content/ShowMessage.aspx" mce_src="http://localhost:1851/content/ShowMessage.aspx" width="720px" height="320px" frameborder="0" scrolling="no"></iframe> </td> <td rowspan="3" width="222" align="center" valign="top" background="../Pictures/K.jpg"> <br /> <asp:ListBox ID="ListBox1" runat="server" Height="300px" Width="200px"></asp:ListBox> <asp:Timer ID="Timer1" runat="server" Interval="10000" OnTick="Timer1_Tick"> </asp:Timer> </td> <td> </td> </ContentTemplate> </asp:UpdatePanel> </tr> </table> <br />  <table cellspacing="0" class="style1"> <tr> <td valign="top"> <FCKeditorV2:FCKeditor ID="FCKeditor2" runat="server" BasePath="../fckeditor/" Height="160px" Width="700px" ToolbarSet=""> </FCKeditorV2:FCKeditor> </td> <td rowspan="3" width="250" align="left" valign="bottom"> <table cellpadding="0" cellspacing="0" class="style1"> <tr> <td valign="top"> 本站公告<img src="../Pictures/Bulletin.gif" mce_src="Pictures/Bulletin.gif" /><br /> <iframe id="Iframe1" src="http://localhost:1851/content/ShowBulletin.aspx" mce_src="http://localhost:1851/content/ShowBulletin.aspx" width="200px" height="50px" frameborder="0" scrolling="no"></iframe> <br /> </td> </tr> <tr> <td align="left" valign="bottom" style="height:50px"> <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/Pictures/PubMessageOk.gif" OnClick="ImageButton1_Click" /> <asp:ImageButton ID="ImageButton2" runat="server" ImageUrl="~/Pictures/ClearMessageOk.gif" OnClick="ImageButton2_Click" /> <asp:ImageButton ID="ImageButton3" runat="server" ImageUrl="~/Pictures/ForbSpeakOk.gif" OnClick="ImageButton3_Click" /> <br /> <asp:ImageButton ID="ImageButton4" runat="server" ImageUrl="~/Pictures/AllowedSpeakOk.gif" OnClick="ImageButton4_Click" /> <asp:ImageButton ID="ImageButton5" runat="server" ImageUrl="~/Pictures/KickOutOk.gif" OnClick="ImageButton5_Click" /> <asp:ImageButton ID="ImageButton6" runat="server" ImageUrl="~/Pictures/ExitChatOk.gif" OnClick="ImageButton6_Click" /> </td> </tr> </table> </td> <td> </td> </tr> </table> <asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server"> </asp:UpdatePanel> </td> </tr> </table> <br /> <table width="1000" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="106" height="197" align="right" valign="middle"> <p align="right"> <img src="../pictures/ipower_logo.jpg" mce_src="pictures/ipower_logo.jpg" width="99" height="60" align="right" /></p> <p> </p> </td> <td align="left" valign="middle"> <div> <div> <asp:Label ID="lblCopyright" runat="server" Text=""></asp:Label> </div> </div> </td> </tr> </table> </form> </body> </html>
OnlineCommunication.aspx.cs代码：
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using HuiYing.BLL; using HuiYing.Model; using System.Data; using System.Text; namespace HuiYingWeb.Content { public partial class OnlineCommunication : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { //记录要截取字符串的长度 if(Application["Message"]!=null) Session["MsgSubLength"] = Application["Message"].ToString().Length; //-------------权限控制部分--------- if (Session["LogonName"] == null) Response.Redirect("Login.aspx"); string permission = new TRoleBLL().GetPermissionByUserName(Session["LogonName"].ToString()); //如果没有设置权限，或权限列表格式不正确 if (permission == string.Empty || permission.Contains(",") == false) return; string[] per = permission.Split(','); //添加权限判断提示 if (per.Contains("11") == false) { Response.Redirect("Index.aspx?ChatPermiState=-1"); } //禁止/允许用户发言按钮权限状态 if (per.Contains("19") == false) { //Button3.Enabled = false; //Button5.Enabled = false; ImageButton3.Enabled = false; ImageButton3.ImageUrl = "~/Pictures/ForbSpeakNo.gif"; ImageButton4.Enabled = false; ImageButton4.ImageUrl = "~/Pictures/AllowedSpeakNo.gif"; } //踢出聊天室按钮权限状态 if (per.Contains("20") == false) { //Button4.Enabled = false; ImageButton5.Enabled = false; ImageButton5.ImageUrl = "~/Pictures/KickOutNo.gif"; } //根据是否是聊天室管理员显示发表留言的不同按钮 if (per.Contains("19") == true && per.Contains("20") ==true) FCKeditor2.ToolbarSet = "Basic"; else FCKeditor2.ToolbarSet = "Simple"; //---------信息显示部分--------- if (Session["LogonName"] != null && Session["RoleName"] != null) { //显示在线 lblUserName.Text = Session["LogonName"].ToString(); lblUserRoleName.Text = Session["RoleName"].ToString(); admin.Visible = (Session["RoleName"].ToString() == "栏目管理员" || Session["RoleName"].ToString() == "超级管理员") ? true : false; //记录在线（Application["OnLine"]的组成形式为：aaa,0|bbb,1|ccc,0|第一部分为用户名，后面为状态码-1离线，0可发言，1禁止发言） if(Application["OnLine"]==null) Application["OnLine"] = "所有人,0|"; if (Application["OnLine"].ToString().Contains(Session["LogonName"].ToString()) == false) Application["OnLine"] += Session["LogonName"].ToString() + ",0|"; //提示进来 string welcome = "<font color='green'>欢迎【<b>" + Session["LogonName"].ToString() + "</b>】进入聊天室</font><br>"; if (Application["Message"] == null) Application["Message"] = string.Empty; //以下这么写存在的问题：如果出来再进去就没有欢迎提示了 //if (Application["Message"].ToString().Contains(welcome) == false) // Application["Message"] += welcome; //换用以下写法 int subLength = 0; if (Session["MsgSubLength"] != null) subLength =int.Parse( Session["MsgSubLength"].ToString()); //如果截取以前的聊天记录（退出前的），不存在欢迎的话则增加欢迎 if (Application["Message"].ToString().Substring(subLength).Contains(welcome) == false) Application["Message"] += welcome; //显示在线用户列表 ShowOnLineUser(); } //显示声明 lblCopyright.Text = new TBasicInfoBLL().GetModel(1).FCopyright; } if (OnLineUserStateCode() == "2") { Application["Message"] += "<font color='red'>【<b>" + Session["LogonName"].ToString() + "</b>】被踢出聊天室！</font><br>"; //记录要截取字符串的长度，因为下次进来不能看到以前的聊天记录 Session["MsgSubLength"] = Application["Message"].ToString().Length; //更新在线 string name = Session["LogonName"].ToString(); Application["OnLine"] = Application["OnLine"].ToString().Replace(name + ",2", ""); Response.Redirect("Login.aspx?ChatState=-1"); } ////显示发言 //ShowMessage(); } //显示在线人员列表 protected void ShowOnLineUser() { if (Application["OnLine"] == null) return; //（Application["OnLine"]的组成形式为：aaa,0|bbb,1|ccc,0|第一部分为用户名，后面为状态码-1离线，0可发言，1禁止发言） string[] on = Application["OnLine"].ToString().Split('|'); //去掉空项 List<string> list = Utility.StringUtil.ListNoEmpty(on.ToList<string>()); //把集合中某项按指定字符拆分，获得拆分子项的第一项 list = Utility.StringUtil.ListSplit(list, ','); ListBox1.DataSource = list; ListBox1.DataBind(); } //显示发言 private void ShowMessage() { StringBuilder sb = new StringBuilder(); if (Application["Message"] != null) { //记录要截取字符串的长度，因为下次进来不能看到以前的聊天记录 if (Session["MsgSubLength"] != null) { sb.Append(Application["Message"].ToString().Substring(int.Parse(Session["MsgSubLength"].ToString()))); } else { sb.Append(Application["Message"].ToString()); } } } //获得在线用户的状态码，-1离线，0可发言，1禁止发言 protected string OnLineUserStateCode() { //获得在线用户列表（Application["OnLine"]的组成形式为：aaa,0|bbb,1|ccc,0|第一部分为用户名，后面为状态码-1离线，0可发言，1禁止发言） if (Application["OnLine"] == null) return "-1"; string[] on = Application["OnLine"].ToString().Split('|'); //去掉空项 List<string> list = Utility.StringUtil.ListNoEmpty(on.ToList<string>()); //获得用户的状态码，如果为0可以发言，如果为1禁止发言 string userStateCode = "-1"; foreach (string li in list) { //当前用户 if (li.Contains(Session["LogonName"].ToString()) == true) { userStateCode = li.Split(',')[1]; } } return userStateCode; } //定时刷新聊天内容 protected void Timer1_Tick(object sender, EventArgs e) { //显示发言 ShowMessage(); //显示在线列表 ShowOnLineUser(); } //退出聊天室 protected void LinkButton1_Click(object sender, EventArgs e) { if (Session["LogonName"] != null) { //更新在线 string name = Session["LogonName"].ToString(); Application["OnLine"] = Application["OnLine"].ToString().Replace(name + ",",""); //提示离开 string leave = "<font color='red'>【<b>" + Session["LogonName"].ToString() + "</b>】离开聊天室</font><br/>"; Application["Message"] = Application["Message"].ToString() + leave; //记录要截取字符串的长度，因为下次进来不能看到以前的聊天记录 Session["MsgSubLength"] = Application["Message"].ToString().Length; } Response.Redirect("Index.aspx"); } //发表聊天内容 protected void ImageButton1_Click(object sender, ImageClickEventArgs e) { //返回登录 if (Session["LogonName"] == null) Response.Redirect("Login.aspx"); //获得在线用户的状态码，如果为0可以发言，如果为1禁止发言 if (OnLineUserStateCode() == "1") { Utility.CommonUtil.Alert("您被禁止发言！"); return; } //状态码如果为-1，不在线 if (OnLineUserStateCode() == "-1") return; //获得发言 string message = string.Empty; if (ListBox1.SelectedIndex >= 0) message = "【<b>" + Session["LogonName"] + "</b>】对【<b>" + ListBox1.SelectedItem.Text + "</b>】说:" + FCKeditor2.Value + "<br/>"; else message = "【<b>" + Session["LogonName"] + "</b>】对所有人说:" + FCKeditor2.Value + "<br/>"; //显示发言 //FCKeditor1.Value += message; FCKeditor2.Value = ""; if (Application["Message"] != null) Application["Message"] += message; else Application["Message"] = message; } //清除聊天内容 protected void ImageButton2_Click(object sender, ImageClickEventArgs e) { if (Application["Message"] != null) { //记录要截取字符串的长度 Session["MsgSubLength"] = Application["Message"].ToString().Length; } } //禁止发言，用户状态码设置为1 protected void ImageButton3_Click(object sender, ImageClickEventArgs e) { //获得在线用户列表（Application["OnLine"]的组成形式为：aaa,0|bbb,1|ccc,0|第一部分为用户名，后面为状态码-1离线，0可发言，1禁止发言） if (Application["OnLine"] == null) return; string[] on = Application["OnLine"].ToString().Split('|'); //去掉空项 List<string> list = Utility.StringUtil.ListNoEmpty(on.ToList<string>()); if (ListBox1.SelectedIndex >= 0) { //如果集合中某项含（注意是“含”）某一个旧字符串，则替换成新字符串（如:list的某项为aa,0 参数oldStr为aa 参数newStr为aa,1 结果 aa,1，因为aa,0中含有字符串aa所以可以被替换） list = Utility.StringUtil.ListFullReplace(list, ListBox1.SelectedItem.Value, ListBox1.SelectedItem.Value + ",1"); //把List重新组合成字符串，赋值给Application["OnLine"] string strOnLine = string.Empty; foreach (string s in list) { strOnLine += s + "|"; } Application["OnLine"] = strOnLine; Application["Message"] += "<font color='orange'>【<b>" + ListBox1.SelectedItem.Value + "</b>】被禁止发言！</font><br/>"; } Response.Redirect(Request.Url.ToString()); } //允许发言，用户状态码设置为0 protected void ImageButton4_Click(object sender, ImageClickEventArgs e) { //获得在线用户列表（Application["OnLine"]的组成形式为：aaa,0|bbb,1|ccc,0|第一部分为用户名，后面为状态码-1离线，0可发言，1禁止发言） if (Application["OnLine"] == null) return; string[] on = Application["OnLine"].ToString().Split('|'); //去掉空项 List<string> list = Utility.StringUtil.ListNoEmpty(on.ToList<string>()); if (ListBox1.SelectedIndex >= 0) { //如果集合中某项含（注意是“含”）某一个旧字符串，则替换成新字符串（如:list的某项为aa,0 参数oldStr为aa 参数newStr为aa,1 结果 aa,1，因为aa,0中含有字符串aa所以可以被替换） list = Utility.StringUtil.ListFullReplace(list, ListBox1.SelectedItem.Value, ListBox1.SelectedItem.Value + ",0"); //把List重新组合成字符串，赋值给Application["OnLine"] string strOnLine = string.Empty; foreach (string s in list) { strOnLine += s + "|"; } Application["OnLine"] = strOnLine; Application["Message"] += "<font color='green'>【<b>" + ListBox1.SelectedItem.Value + "</b>】被允许发言！</font><br/>"; } Response.Redirect(Request.Url.ToString()); } //踢出聊天室，用户状态码设置为2 protected void ImageButton5_Click(object sender, ImageClickEventArgs e) { //获得在线用户列表（Application["OnLine"]的组成形式为：aaa,0|bbb,1|ccc,0|第一部分为用户名，后面为状态码-1离线，0可发言，1禁止发言） if (Application["OnLine"] == null) return; string[] on = Application["OnLine"].ToString().Split('|'); //去掉空项 List<string> list = Utility.StringUtil.ListNoEmpty(on.ToList<string>()); if (ListBox1.SelectedIndex >= 0) { //如果集合中某项含（注意是“含”）某一个旧字符串，则替换成新字符串（如:list的某项为aa,0 参数oldStr为aa 参数newStr为aa,1 结果 aa,1，因为aa,0中含有字符串aa所以可以被替换） list = Utility.StringUtil.ListFullReplace(list, ListBox1.SelectedItem.Value, ListBox1.SelectedItem.Value + ",2"); //把List重新组合成字符串，赋值给Application["OnLine"] string strOnLine = string.Empty; foreach (string s in list) { strOnLine += s + "|"; } Application["OnLine"] = strOnLine; } Response.Redirect(Request.Url.ToString()); } //退出聊天室 protected void ImageButton6_Click(object sender, ImageClickEventArgs e) { if (Session["LogonName"] != null && Application["OnLine"]!=null) { //更新在线 string name = Session["LogonName"].ToString(); Application["OnLine"] = Application["OnLine"].ToString().Replace(name + ",", ""); //提示离开 string leave = "<font color='red'>【<b>" + Session["LogonName"].ToString() + "</b>】离开聊天室</font><br/>"; Application["Message"] = Application["Message"].ToString() + leave; //记录要截取字符串的长度，因为下次进来不能看到以前的聊天记录 Session["MsgSubLength"] = Application["Message"].ToString().Length; } Response.Redirect("Index.aspx"); } } }
ShowMessage.aspx代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ShowMessage.aspx.cs" Inherits="HuiYingWeb.Content.ShowMessage" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head id="Head1" runat="server"> <title></title>  <meta http-equiv="REFRESH" content="12,ShowMessage.aspx"/> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1"> .chatMsg{ width:690px; height:280px; border:#eee solid 1px; overflow:scroll; } </style> <link href="../Style/Style.css" mce_href="Style/Style.css" rel="stylesheet" type="text/css" /> </head> <body onload="var t = document.getElementById('chatMessage'); t.scrollTop = t.scrollHeight;"> <form id="form1" runat="server"> <div id="chatMessage" runat="server" class="chatMsg"></div><br /> </form> </body> </html>
ShowMessage.aspx.cs代码：
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Text; namespace HuiYingWeb.Content { public partial class ShowMessage : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { //显示发言 StringBuilder sb = new StringBuilder(); if (Application["Message"] != null) { //记录要截取字符串的长度，因为下次进来不能看到以前的聊天记录 if (Session["MsgSubLength"] != null) { sb.Append(Application["Message"].ToString().Substring(int.Parse(Session["MsgSubLength"].ToString()))); chatMessage.InnerHtml = sb.ToString(); } else { sb.Append(Application["Message"].ToString()); chatMessage.InnerHtml = sb.ToString(); } //太长截取 if (Application["Message"].ToString().Length > 40000) { string tempStr = Application["Message"].ToString(); Application["Message"] = tempStr.Substring(Application["Message"].ToString().Length -40000); } } } } }

分享到：