资讯专栏INFORMATION COLUMN

nodejs + websocket (socket.io)

awkj / 1282人阅读

摘要:协议做不到服务器主动向客户端推送信息。这种单向请求的特点,注定了如果服务器有连续的状态变化,客户端要获知就非常麻烦。双向通信,服务器可以向客户端主动发送数据。数据格式比较轻量,性能开销小,通信高效。

为什么需要 WebSocket?

因为个人对概念理解不是很深,文字表达能力不强,如果有关HTTP等方面描述不准确,欢迎纠正,谢谢大家

初次接触 WebSocket 的人,都会问同样的问题:我们已经有了 HTTP 协议,为什么还需要另一个协议?它能带来什么好处?

答案很简单,因为 HTTP 协议有一个缺陷:通信只能由客户端发起

举例来说:我们想了解今天的天气,只能是客户端向服务器发出请求,服务器返回查询结果。HTTP 协议做不到服务器主动向客户端推送信息。

这种单向请求的特点,注定了如果服务器有连续的状态变化,客户端要获知就非常麻烦。我们只能使用"轮询":设置定时器每隔一段时候,就发出一个"询问"(简单理解为ajax请求),了解服务器有没有新的信息。最典型的场景就是聊天室。

---- 参考了阮一峰老师的文章: WebSocket 教程

轮询请求的缺点:

不停地链接,断开,链接,断开请求,浪费很多服务器资源

浪费带宽

移动端浪费流量

websocket的优点:

没有同源限制,客户端可以与任意服务器通信,不涉及到跨域的问题。

双向通信,服务器可以向客户端主动发送数据。

数据格式比较轻量,性能开销小,通信高效。

websocket为什么高效
普通的http通信是基于字符的通信(超文本), websocket一开始是文本协议, 当链接建立后变成二进制协议, 数据无需转换,因此效率高。
socket.io的使用
socket.io是一个封装后的库,原生 websocket 比较复杂,需要自己处理请求头,设置持续链接等等。因此使用socket.io
安装

npm i socket.io -D
socket主要有两个方法:
sock.emit("name", data) 主动发送数据
sock.on("name", function(data){ })` 接收数据

1.服务端
    // server.js
    const http = require("http")
    const io = require("socket.io")
    
    let server = http.createServer((req, res)=>{})
    server.listen(8080)
    
    // 建立ws  websocket简称ws
    let wsServer = io.listen(server);
    
    wsServer.on("connection", sock=>{
    
      sock.on("aaa", function(a,b){         // name -> "aaa" 要与前台的 name 保持一致
        console.log(a)
        console.log(b)
        console.log(arguments)
      })     // "aaa"事件名与前台的一致
    
      setInterval(function(){
        sock.emit("bbb", "服务器发来的数据")  // name -> "bbb" 要与前台的 name 保持一致
      }, 2000)
    })
2. 客户端



  
  
  

   
  
  



上面的代码直接复制下来就能使用。怎么运行nodejs服务我就不再讲了啊。
怎么样,是不是特别简单
妈妈再也不用担心我的学习了~

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/104227.html

相关文章

  • 初探WebSocket

    摘要:流控制通常就是在客户端的页面使用一个隐藏的窗口向服务端发出一个长连接的请求。和长链接以上几种服务器推的技术中长轮询和流控制其实都是基于长链接来实现的,也就是中所谓的。通信协议于年被定为标准,并被所补充规范。 初探WebSocket node websocket socket.io 我们平常开发的大部分web页面都是主动‘拉’的形式,如果需要更新页面内容,则需要刷新一个,但Slack工...

    Channe 评论0 收藏0
  • NodeJs 【加强版】实现跨域WebSocket 即时通讯

    摘要:原生使用起来不太方便,我们使用,它很好地封装了接口,提供了更简单灵活的接口,也对不支持的浏览器提供了向下兼容。 原生WebSocket API使用起来不太方便,我们使用Socket.io,它很好地封装了webSocket接口,提供了更简单、灵活的接口,也对不支持webSocket的浏览器提供了向下兼容。 服务端代码 根据不同客户端传来的消息存储一下 不同的对象 需要安装 npm i ...

    PAMPANG 评论0 收藏0
  • NodeJs 【加强版】实现跨域WebSocket 即时通讯

    摘要:原生使用起来不太方便,我们使用,它很好地封装了接口,提供了更简单灵活的接口,也对不支持的浏览器提供了向下兼容。 原生WebSocket API使用起来不太方便,我们使用Socket.io,它很好地封装了webSocket接口,提供了更简单、灵活的接口,也对不支持webSocket的浏览器提供了向下兼容。 服务端代码 根据不同客户端传来的消息存储一下 不同的对象 需要安装 npm i ...

    AlphaGooo 评论0 收藏0
  • NodeJs 【加强版】实现跨域WebSocket 即时通讯

    摘要:原生使用起来不太方便,我们使用,它很好地封装了接口,提供了更简单灵活的接口,也对不支持的浏览器提供了向下兼容。 原生WebSocket API使用起来不太方便,我们使用Socket.io,它很好地封装了webSocket接口,提供了更简单、灵活的接口,也对不支持webSocket的浏览器提供了向下兼容。 服务端代码 根据不同客户端传来的消息存储一下 不同的对象 需要安装 npm i ...

    ivyzhang 评论0 收藏0

发表评论

0条评论

awkj

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<