WebSocket搭建 (node.js、c#作为服务器)

1)安装node.js环境。

参考:https://www.runoob.com/nodejs/nodejs-install-setup.html

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) 如何运行

  1. C#服务端直接运行即可;
  2. node.js搭建服务器,在cmd中进入工程目录,使用指令: node server.js 运行。
  3. 服务端运行后,打开html客户端即可测试。

成功结果如下:


成功

点击提交后,服务端接收到客户端传来的信息。这里将传递的信息值写死,实际上需要根据需要传递信息。

7) 关于多个客户端socket,服务端如何获得他们的唯一标识?

C#服务端:


如上图,得到的socket对象下有ConnectionInfo属性,可进入调试查看详细。
这里是得到了该socket的唯一标识id,可供服务器辨识。

node.js服务端:

暂时没找到解决方法,初步解决方法:
在连接成功时,客户端手动向服务端传递一个自身身份的信息。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,271评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,275评论 2 380
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,151评论 0 336
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,550评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,553评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,559评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,924评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,580评论 0 257
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,826评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,578评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,661评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,363评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,940评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,926评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,156评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,872评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,391评论 2 342