继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Nodejs + WebSocket简单介绍及示例 - 第一章

向建峰_Javan
关注TA
已关注
手记 110
粉丝 1.5万
获赞 5278

WebSocket是什么?

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

Nodejs + WebSocket简单介绍及示例 - 第一章

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

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

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

WebSocket 事件

事件 描述
Socket.onopen 连接建立时触发
Socket.onmessage 客户端接收服务端数据时触发
Socket.onerror 通信发生错误时触发
Socket.onclose 连接关闭时触发

WebSocket 方法

方法 描述
Socket.send() 使用连接发送数据
Socket.close() 关闭连接

Nodejs + WebSocket 示例

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

Nodejs + WebSocket简单介绍及示例 - 第一章

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

打开App,阅读手记
12人推荐
发表评论
随时随地看视频慕课网APP

热门评论

https://img3.mukewang.com/5cd589570001d8a207630454.jpg

请问如果部署上线这个端口号改成啥?

查看全部评论