基于websocket-sharp实现客户端与服务器端数据交互的小Demo
1.服务器端实现如下
static void Main(string[] args) { //1.創建WebSocketServer实例 var wssv = new WebSocketServer(9191); wssv.Log.Level = LogLevel.Trace; //2.添加WebSocket服务 wssv.AddWebSocketService<Echo>("/Echo"); //3.开启 wssv.Start(); //4.监听 if (wssv.IsListening) { Console.WriteLine("Listening on port {0}, and providing WebSocket services:", wssv.Port); foreach (var path in wssv.WebSocketServices.Paths) Console.WriteLine("- {0}", path); } Console.WriteLine("\nPress Enter q to stop the server..."); //string str=Console.ReadLine(); while (Console.ReadLine() != "q") { continue; } //关闭 wssv.Stop(); }
2.Echo服务实现如下
public class Echo : WebSocketBehavior {
//OnMessage接收前端传入的数据并进行相应的处理 protected override void OnMessage(MessageEventArgs e) { var models = e.Data; //使用newtonsoft.json来处理前端传进来的Json数据 JObject jo = (JObject)JsonConvert.DeserializeObject(e.Data); string name = jo["Name"].ToString(); string msg = jo["Msg"].ToString(); if (msg == "Login") {
//Send将处理完的数据返回到前端 Send(string.Format("\"{0}\" --> Connect OK!", name)); } else { Send(string.Format("\"{0}\" say: {1}", name,msg)); } } }
3.客户端实现如下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>WebSocketTest</title> <script type="text/javascript"> var url = "ws://localhost:9191/Echo"; var output; var websocket; function onLogin() { var name = document.getElementById("txtName").value; if (name.trim().length == 0) { alert("请先输入用户名"); return; } websocket = new WebSocket(url); websocket.onopen = function () { var data = { "Name": name, "Msg": "Login" }; var jsData = JSON.stringify(data); websocket.send(jsData); alert("Connect Request send.....") } websocket.onmessage = function (e) { onMessage(e); }; }//初始化WebSocket连接 function onMessage(event) { alert(event.data); }//接收服務器端發送的信息 function sendMessage() { //var var name = document.getElementById("txtName").value; var msg = document.getElementById("txtArea").value; var data = { "Name": name, "Msg": msg }; var jsData= JSON.stringify(data); websocket.send(jsData); websocket.onmessage = function (e) { onMessage(e); }; } </script> </head> <body> <div> <span>Name</span><input type="text" value="" id="txtName" /> <input type="button" value="Login" id="btn_login" onclick="onLogin()" /><br /><br /> <textarea id="txtArea" style="width: 240px;"></textarea><br /><button id="SendData" onclick="sendMessage()">Send</button> </div> </body> </html>
4.结果如下
5.开源地址:https://github.com/sta/websocket-sharp