点击右上方红色按钮关注“web秀”，让你真正秀起来

WebSocket是什么？

如果说ajax像手机发短信一样，发送信息，获取信息，那么websocket技术则是打电话这样。WebSocket要达到的目的是让用户不需要刷新浏览器就可以获得实时更新。

在WebSocket以前你可能会使用ajax进行轮询(包括现在有些没有集成WebSocket的软件)，这就造成了服务器的多重压,大量消耗服务器带宽和资源。

面对这种状况，HTML5定义了WebSocket协议，能更好的节省服务器资源和带宽并实现真正意义上的实时推送。

WebSocket协议本质上是一个基于TCP的协议，它由通信协议和编程API组成，WebSocket能够在浏览器和服务器之间建立双向连接， 以基于事件的方式，赋予浏览器实时通信能力。既然是双向通信，就意味着服务器端和客户端可以同时发送并响应请求，而不再像HTTP的请求和响应。

WebSocket 事件

1、Socket.onopen 连接建立时触发

2、Socket.onmessage 客户端接收服务端数据时触发

3、Socket.onerror 通信发生错误时触发

4、Socket.onclose 连接关闭时触发

WebSocket 方法

1、Socket.send() 使用连接发送数据

2、Socket.close() 关闭连接

Nodejs + WebSocket 示例

这里我们先安装一下WebSocket模块：

npm i nodejs-websocket -S

新建一个index.js作为服务端：

var ws = require("nodejs-websocket");console.log("开始建立连接...")var server = ws.createServer(function(conn){ conn.on("text", function (str) { console.log("message:"+str) conn.sendText("My name is Web Xiu!"); }) conn.on("close", function (code, reason) { console.log("关闭连接") }); conn.on("error", function (code, reason) { console.log("异常关闭") });}).listen(8001)console.log("WebSocket建立完毕")

客户端

if(window.WebSocket){ var ws = new WebSocket('ws://localhost:8001'); ws.onopen = function(e){ console.log("连接服务器成功"); // 向服务器发送消息 ws.send("what`s your name?"); } ws.onclose = function(e){ console.log("服务器关闭"); } ws.onerror = function(){ console.log("连接出错"); } // 接收服务器的消息 ws.onmessage = function(e){ let message = "message:"+e.data+""; console.log(message); } }

这样，客户端发送：ws.send("whats your name?");，服务端回复：conn.sendText("My name is Web Xiu!");`，只要连接不断开，就可以一直通信。

公告

为了感谢大家一直以来的支持，小编发起了抽奖活动，大家可以去参与，转发抽奖活动和关注小编即可参与，抽出5名小伙伴每人20元话费奖励。再次感谢大家的支持。