[c#]使用Fleck实现简单的WebSocket含兼容低版本IE

article/2025/10/6 1:50:21

WebSocket是html5的一种协议,那么就表示要使用websocket客户端的浏览器就要支持html5。

对于不支持的使用flash去解决。

Fleck源码地址

服务端采用的是Fleck,Fleck的好处就是简单方便,作者已经进行了完整的封装,可以根据自己情况进行修改

兼容低版本IE

使用flash实现兼容低版本IE

websocket 连接集合

using Fleck;
using System.Collections.Generic;namespace Common
{public class FlectWebSock{public static List<IWebSocketConnection> sockets = new List<IWebSocketConnection>();}
}

在启动时创建 WebSocketServer服务

        protected void Application_Start(){AreaRegistration.RegisterAllAreas();WebApiConfig.Register(GlobalConfiguration.Configuration);FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);RouteConfig.RegisterRoutes(RouteTable.Routes);FleckWebSocket();}public void FleckWebSocket(){/*与网站的端口号不一致,与websocket地址的端口号保持一致*/var socketServer = new WebSocketServer("ws://0.0.0.0:58349");/*发生错误自动重启*/socketServer.RestartAfterListenError = true;socketServer.Start(socket =>{socket.OnOpen = () =>{FlectWebSock.sockets.Add(socket);};socket.OnClose = () =>{FlectWebSock.sockets.Remove(socket);};socket.OnMessage =Message => {FlectWebSock.sockets.ForEach(x => x.Send(Message));};});}

简单的页面

   怎么称呼您？<input type="text" value="张三" id="userName" /><br />您要说什么？<input type="text" id="Message" /><input type="button" value="发送" onclick="Send()" /><br /><input type="button" value="连接" onclick="Connect()" /><input type="button" value="关闭" onclick="Close()" /><div id="content"></div>

简单的样式

  #content{height:400px;overflow-y:auto;width:500px;}

前端js

<!--兼容低版本IE方案的JS--><script src="~/Script/webSocket_js/swfobject.js"></script><!--兼容低版本IE方案的JS--><script src="~/Script/webSocket_js/web_socket.js"></script><script type="text/javascript">var _WebSocket;/*兼容低版本IE方案的SWF地址*/WEB_SOCKET_SWF_LOCATION = "/Script/webSocket_js/WebSocketMain.swf";/*兼容低版本IE方案,调试信息*/WEB_SOCKET_DEBUG = true;function Connect() {if (_WebSocket != null) {switch (_WebSocket.readyState) {case _WebSocket.CLOSED: Open(); break;default: alert("无法操作！"); break;}} else {Open();}}function Open() {/*websocket地址端口号*/_WebSocket = new WebSocket("ws://localhost:58349");_WebSocket.onopen = function () {alert("连接成功！");}_WebSocket.onmessage = function (socket) {var p = document.createElement("p");p.innerHTML = socket.data;document.getElementById("content").appendChild(p);}_WebSocket.onclose = function () {alert("关闭成功！");}}function Send() {/*发送消息*/_WebSocket.send(DateNow() + " " + document.getElementById("userName").value + "：" + document.getElementById("Message").value);}function Close() {_WebSocket.close();}function DateNow(){var time=new Date();return parseInt(time.getFullYear())+"-"+time.getMonth()+"-"+time.getDate();}</script>

效果图