短轮询,长轮询,sse和websoket的区别

本文探讨了四种前端实时通信技术:短轮询、长轮询、Server-Sent Events(SSE)和WebSocket。短轮询通过定时器不断发起请求,但可能造成资源浪费;长轮询保持连接直到有更新,对服务器压力较大;SSE允许服务器单向推送信息,但不支持双向通信;WebSocket则实现了全双工通信,提供高效双向交互。这四种技术各有优劣,适用于不同的实时应用场景。
摘要由CSDN通过智能技术生成

短轮询

短轮询(定时器+ajax,实时性没保证,有很多无效请求浪费资源)

不管服务端数据有无更新,客户端每隔定长时间请求拉取一次数据,可能有更新数据返回,也可能什么都没有。

代码实现

var xhr = new XMLHttpRequest();    
  setInterval(function(){        
    xhr.open('GET','/user');        
    xhr.onreadystatechange = function(){  
      ajax()    
     };       
    xhr.send();    
  },1000)

 

长轮询 

长轮询(对于前端来说没什么区别,对后端有较大压力)

户端向服务器发送Ajax请求,服务器接到请求后hold住连接,直到有新消息才返回响应信息并关闭连接,客户端处理完响应信息后再向服务器发送新的请求。

代码实现

function ajax(){        
   var xhr = new XMLHttpRequest();
   xhr.open('GET','/user');        
   xhr.onreadystatechange = function(){              
   ajax();        
   };        
   xhr.send();    
}

 

sse

 不能完美实现双向沟通

SSE 的基本思想是,服务器使用流信息向服务器推送信息。

websocket 

可以完美的实现双向沟通

WebSocket 是一个全双工的协议,也就是通信双方是平等的,可以相互发送消息, 而 SSE 的方式是单向通信的,只能 由服务器端向客户端推送信息,如果客户端需要发送信息就是属于下一个 http 请求了

实现代码 

var ws = new WebSocket('ws://....')
ws.onopen = function(){  }
ws.onmessage = function(data) {  }

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

ling…

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值