一：什么是WebSocket？
WebSocket 协议在2008年诞生，2011年成为国际标准。所有浏览器都已经支持了。
它的最大特点就是，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向平等对话，属于服务器推送技术的一种。
其他特点包括：
（1）建立在 TCP 协议之上，服务器端的实现比较容易。
（2）与 HTTP 协议有着良好的兼容性。默认端口也是80和443，并且握手阶段采用 HTTP 协议，因此握手时不容易屏蔽，能通过各种 HTTP 代理服务器。
（3）数据格式比较轻量，性能开销小，通信高效。
（4）可以发送文本，也可以发送二进制数据。
（5）没有同源限制，客户端可以与任意服务器通信。
（6）协议标识符是ws（如果加密，则为wss），服务器网址就是 URL。
-----阮一峰博客
而socket.io则使websocket应用的开发变得简单。
二：用express+socket.io搭建websocket聊天室服务器
1 .用npm初始化服务器程序
npm init -y
2.要使用node安装express,socket.io等模块才能搭建websocke服务器
npm install express socket.io
3.创建app.js作为服务器的入口
// 使用 express 来开启服务器 var express = require(‘express‘) var app = express() var http = require(‘http‘).createServer(app) var io = require(‘socket.io‘)(http) app.use(express.static(__dirname)) // 设置请求的路径： app.get(‘/‘, (req, res) => { // 返回 index.html 作为客户端 res.sendFile(__dirname + ‘/index.html‘) }) // 开启 weboscket io.on(‘connection‘, socket => { console.log(‘有用户连接上来了‘) socket.on(‘sendval‘, val => { // val.msg // 这个函数就是接收到数据之后的回调函数 console.log(socket) console.log(‘客户端发送的消息为:‘ + val.msg) // 将浏览器发送的消息，原样返回 io.emit(‘sendval‘, val) }) }) // 开启监听：端口 3000 ip 地址： localhost/127.0.0.1 http.listen(3000, () => { console.log(‘listening on *:3000‘) })
4.创建用于浏览器访问服务器的客户端HTML页面
<!doctype html> <html> <head> <title>Socket.IO chat</title> </head> <body> <ul id="messages"></ul> <form action=""> <input id="m" autocomplete="off" /><button>Send</button> </form> </body> <!-- 导入 socket.io和jquery --> <script src="https://cdn.bootcdn.net/ajax/libs/socket.io/3.0.0-rc4/socket.io.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(function () { var socket = io(‘http://localhost:3000/‘) $(‘form‘).submit(function (e) { e.preventDefault() // 发送 socket.emit(‘sendval‘, { msg: $(‘#m‘).val() }) // 将输入框内容清空 $(‘#m‘).val(‘‘) }) // 接收服务器的消息 socket.on(‘sendval‘, val => { // 将消息渲染到页面上 $(‘#messages‘).append($(‘<li>‘).html(val.msg)) }) }) </script> </html>
4.最终形成下面的一些文件
5 运行程序
node app.js
三：运行效果
通过浏览器访问 localhost:3000
发送消息，服务器原样返回，使用jquery将消息渲染到页面上