首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

你应该要了解的WebSocket

作者:盲目的拾荒者博客:https://blog.csdn.net/niugang0920

-

之前也了解过webSocket但在实际的项目没有用到过。最近因为项目中涉及浏览器需要定时轮询获取服务器最新数据,因为HTTP协议做不到服务器主动向客户端推送信息,所以传统的做法就是客户端写定时任务获取最新的数据,轮询的效率低,非常浪费资源(因为必须不停连接,或者 HTTP 连接始终打开).

WebSocket介绍

WebSocket协议提供了通过一个套接字实现全双工通信的功能。 除了其他的功能之外, 它能够实现Web浏览器和服务器之间的异步通信。全双工意味着服务器可以发送消息给浏览器, 浏览器也可以发送消息给服务器。

WebSocket通信可以应用于任何类型的应用中, 但是WebSocket最常见的应用场景是实现服务器和基于浏览器的应用之间的通信。 浏览器中的JavaScript客户端开启一个到服务器的连接, 服务器通过这个连接发送更新给浏览器。 相比历史上轮询服务端以查找更新的方案, 这种技术更加高效和自然。

其他特点包括:

建立在 TCP 协议之上,服务器端的实现比较容易。

与 HTTP 协议有着良好的兼容性。默认端口也是80和443,并且握手阶段采用 HTTP 协议,因此握手时不容易屏蔽,能通过各种 HTTP 代理服务器。

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

可以发送文本,也可以发送二进制数据。

没有同源限制,客户端可以与任意服务器通信。

协议标识符是ws(如果加密,则为wss),服务器网址就是 URL

WebSocket缺点

WebSocket是一个相对比较新的规范。 虽然它早在2011年底就实现了规范化, 但即便如此, 在Web浏览器和应用服务器上依然没有得到一致的支持。 Firefox和Chrome早就已经完整支持WebSocket了, 但是其他的一些浏览器刚刚开始支持WebSocket。 如下列出了几个流行的浏览器支持WebSocket功能的最低版本:

Internet Explorer:10.0

Firefox: 4.0(部分支持),6.0(完整支持) 。

Chrome: 4.0(部分支持),13.0(完整支持) 。

Safari: 5.0(部分支持),6.0(完整支持) 。

Opera: 11.0(部分支持),12.10(完整支持) 。

iOS Safari: 4.2(部分支持),6.0(完整支持) 。

Android Browser: 4.4。

防火墙代理通常会限制所有除HTTP以外的流量。 它们有可能不支持或者(还)没有配置允许进行WebSocket通信。

WebSocket备选方案

提到WebSocket的备用方案,这恰是SockJS所擅长的。 SockJS是WebSocket技术的一种模拟,在表面上它尽可能对应WebSocket API,但是在底层它非常智能,如果WebSocket技术不可用的话,就会选择另外的通信方式。SockJS会优先选用WebSocket,但是如果WebSocket不可用的话,它将会从如下的方案中挑选最优的可行方案:

XHR流。

XDR流。

iFrame事件源。

iFrame HTML文件。

XHR轮询。

XDR轮询。

iFrame XHR轮询。

JSONP轮询。

好消息是在使用SockJS之前, 我们并没有必要全部了解这些方案。SockJS让我们能够使用统一的编程模型, 就好像在各个层面都完整支持WebSocket一样,SockJS在底层会提供备用方案。

使用STOMP消息

假设HTTP协议并不存在,只能使用TCP套接字来编写Web应用,你可能会疯掉。 当然,我们也许能够完成这一壮举,但是这需要自行设计客户端和服务器端都认可的协议,从而实现有效的通信。 简单来说,这不是一件容易的事情。不过, 幸好我们有HTTP, 它解决了Web浏览器发起请求以及Web服务器响应请求的细节。这样的话,大多数的开发人员并不需要编写低层基于TCP套接字通信的相关代码。

直接使用WebSocket(或SockJS)就很类似于使用TCP套接字来编写Web应用。 因为没有高层级的线路协议(wire protocol),因此就需要我们定义应用之间所发送消息的语义,还需要确保连接的两端都能遵循这些语义。不过,好消息是我们并非必须要使用原生的WebSocket连接。 就像HTTP在TCP套接字之上添加了请求-响应模型层一样,STOMP在WebSocket之上提供了一个基于帧的线路格式(frame-based wireformat)层,用来定义消息的语义。乍看上去,STOMP的消息格式非常类似于HTTP请求的结构。 与HTTP请求和响应类似, STOMP帧由命令、 一个或多个头信息以及负载所组成。 例如,如下就是发送数据的一个STOMP帧:

案列

基于SpringWebSocket整合Vue,Vue采用原生WebSocketApI

基于SpringWebSocket SockJS Stomp整合Vue,Vue采用原生stomp

再一次感谢您花费时间阅读这篇文章!祝您在这里阅读愉快!2018年 11月 09日

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20181110G007VP00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券