1)安装node.js环境。
2)安装ws引用
cmd命令台中,项目目录下使用 npm install ws,安装ws模块;
也可以使用npm install ws -g 安装全局ws模块。
3) 编写客户端代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div>
<form id="Form">
<input type="input" name="" id="SendInfo" value="" />
<button type="submit">提交</button>
</form>
<div id="hello" style="border: dashed 1px black;height: 500px;width: 500px;margin-top: 10px;"></div>
</div>
</body>
<script type="text/javascript">
var test = function() {
var print = document.getElementById('hello');
var form = document.getElementById('Form');
var inputStr = document.getElementById('SendInfo');
print.innerHTML += "connecting to server ..<br/>";
//参数即想要连接服务器的ip。 服务器可以是node.js, 也可以是其他项目,如c#
window.ws = new WebSocket('ws://127.0.0.1:8183/'); //连接服务
//监听消息状态
ws.onmessage = function(msg) {
print.innerHTML += msg.data + '<br/>'
}
//监听链接状态
ws.onopen = function() {
print.innerHTML += 'connection open <br/>'
}
//监听关闭状态
ws.onclose = function() {
print.innerHTML += 'connection closed<br/>';
}
//向服务器端发送消息
form.addEventListener('submit', function(e) {
e.preventDefault();
var jsonObj = {"name":"zhangsan", "age":18};
//传入一个json字符串进行测试,服务器会进行判断。
ws.send(JSON.stringify(jsonObj));
//传入一个非json字符串进行测试,服务器会进行判断。
ws.send("test");
})
}
window.onload = test();
</script>
</html>
主要代码:
- window.ws = new WebSocket('ws://127.0.0.1:8183/') 用于实例化websocket对象。
- ws对象有三个主要的属性: onmessage、onopen、onclose。用法简单,见代码详细。
- ws.send() 用于向服务端传输消息。
4)编写服务端代码(node.js)
server.js
var ws = require("ws"); // 加载ws模块;
// 启动websocket服务器
var Server = new ws.Server({
host: "127.0.0.1",
port: 8183,
});
console.log('WebSocket sever is listening at port 127.0.0.1:8183');
// 建立连接,监听客户端请求,绑定对应事件;
//socket参数就是监听到的socket对象。
/*好像没有类似 socket.onmessage(function(msg){}) 的写法。 */
Server.on("connection", socket => {
console.log("监听到请求");
//消息监听
socket.on("message", function(msg) {
console.log("接收到消息:" + msg);
setTimeout(() => {
socket.send("1秒延时,收到了,正在处理");
}, 1000);
//这里要求客户端传入的是一个json格式的【字符串】
try{
var jsonObj = JSON.parse(msg);
//如果msg能够转成json对象,且不为空,可以认为这是一个msg字符串。
if(typeof jsonObj == "object" && jsonObj){
console.log("传入的是一个json字符串,name:" + jsonObj.name);
}
else{
console.log("传入的不是json字符串");
}
}catch{
console.log("传入的不是json字符串");
}
setTimeout(() => {
socket.send("3秒延时,返回数据");
//socket.close()
}, 3000);
});
//客户端关闭监听
socket.on("close", function() {
console.log("request close");
});
//错误监听
socket.on("error", function(err) {
console.log("request error", err);
});
});
- 方法同样很简单。注意引用ws模块!(第一行)
- 好像没有类似
socket.onmessage(function(msg){
})
的写法?
5)编写服务端代码(C#)
新建控制台应用程序。
-
首先引用Fleck库。
客户端代码如下
using Fleck;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net.WebSockets;
namespace WebSocketDemo
{
class Program
{
static void Main(string[] args)
{
//存放连接服务器的socket对象
var allScokets = new List<IWebSocketConnection>();
var server = new WebSocketServer("ws://127.0.0.1:8183"); //创建webscoket服务端实例
server.Start(socket => {
socket.OnOpen = () =>
{
Console.WriteLine("Open");
allScokets.Add(socket);
};
socket.OnClose = () =>
{
Console.WriteLine("Close");
allScokets.Remove(socket);
};
socket.OnMessage = message => {
Console.WriteLine(message);
};
});
var input = Console.ReadLine();
while (input != "exit")
{
foreach (var socket in allScokets.ToList())
{
socket.Send("服务端:" + input);
}
input = Console.ReadLine();
}
}
}
}
-
成功运行结果如下
C#中服务端写法与客户端写法类似。
6) 如何运行
- C#服务端直接运行即可;
- node.js搭建服务器,在cmd中进入工程目录,使用指令: node server.js 运行。
- 服务端运行后,打开html客户端即可测试。
成功结果如下:
点击提交后,服务端接收到客户端传来的信息。这里将传递的信息值写死,实际上需要根据需要传递信息。
7) 关于多个客户端socket,服务端如何获得他们的唯一标识?
C#服务端:
如上图,得到的socket对象下有ConnectionInfo属性,可进入调试查看详细。
这里是得到了该socket的唯一标识id,可供服务器辨识。
node.js服务端:
暂时没找到解决方法,初步解决方法:
在连接成功时,客户端手动向服务端传递一个自身身份的信息。