HTTP 协议是一种无状态的、无连接的、单向的应用层协议。

如果我们某些时候需要双向主动通信、需要服务器主动给客户端浏览器发送信息,该怎么办?

诚然有AJAX方式可用。但最适合的必然是WebSocket。

本文例程有两部分组成,

服务端,Server.js:

var io = require('socket.io')();

io.on("connection", function(client) {
    console.log("connected");

    client.on("message",function(message){
        console.log("message from client:"+message);
    })

    io.emit("message","this is server");
});


io.listen(8000);

代码解析:

1、监听连接信息,当收到连接后,向客户端发送一句消息,消息头是“message”,消息体是"this is server"。消息头用来表识消息内容,在客户端,需要识别这个消息头才能正确获取消息体内容。

2、同时,监听客户端发来的消息头为“message“的消息。

客户端:

<script src="https://cdn.bootcss.com/socket.io/2.2.0/socket.io.js"></script>
<script>
    var socket = io('http://127.0.0.1:8000');
    socket.on("connect", function(){
        console.log("connect");
        socket.emit("message","this is client");
    });
    socket.on("message", function(message){
        console.log("message from server:",message);
    });
    
</script>

代码解析:

1、加载socket.io库客户端。

2、连接websocket服务器,连接成功后,发送一条消息。并像服务器一样监听“message“类消息。

运行效果: