Websocket(1)Node构建Websocket服务

2021-12-02  本文已影响0人  方_糖
前言

Websocket和HTTP的主要区别是:Websocket是双向请求,可以由服务器主动发起;而HTTP是单向请求,只能由客户端发起。

1. 安装websocket :npm install ws
2. 在目录添加一个server.js作为服务器和一个index.html页面作为客户端
目录.png
3. server.js代码如下
const http = require('http');
const WebSocket = require('ws');
const fs = require('fs')
const buffer = require('buffer');

//创建服务器
const server = require("http").createServer((req, res) => {
    res.setHeader("Content-Type", "text/html");
    res.statusCode = 200; 
    fs.readFile("index.html", (err, data) => {
        if(err){
            res.end("error");
            return
        }
        res.end(data)
    })
})

//使用websocket
const ws = new WebSocket.Server({server});
ws.on("connection", ws => {
    console.log("已连接客户端");
    //发送消息给客户端
    ws.send("hello client!")
    //监听客户端发来的消息
    ws.on("message", e => {
        //接收到的是一个buffer类型的数据,如<Buffer 68 65 6c 6c 6f 20 73 65 72 76 65 72>
        console.log(e)
        console.log(e.toString())   //将buffer转为字符串
    })
})

//添加监听
server.listen(3001, () => {
    console.log("localhost:3001")
})
4. index.html代码如下
<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <div>client</div>
        <script>
            var ws = new WebSocket(`ws://localhost:3001`);
            //连接成功后的回调函数
            ws.onopen = () => {
                //发送消息给服务器
                ws.send("hello server");
                console.log("open")
            }
            //监听服务器发来的消息
            ws.onmessage = res => {
                console.log(res.data)
            }
            //关闭连接的回调
            ws.onclose = function(){
                console.log("server has closed")
            }

        </script>
    </body>
</html>
5. 开启服务器和客户端
浏览器输出
上一篇下一篇

猜你喜欢

热点阅读