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

最新推荐文章于 2024-07-10 16:07:22 发布

夜跑者

最新推荐文章于 2024-07-10 16:07:22 发布

阅读量594

点赞数

分类专栏： Ajax

原文链接：https://www.jianshu.com/p/6fbcad96e6c3

版权

Ajax 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

文章转自：https://www.jianshu.com/p/6fbcad96e6c3

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();
            }
        }
    }
}