一文搞懂websocket

前言

最近空了些时间来研究一些小知识点。今天就从websocket定义,作用,使用场景等角度浅探讨一下。

1.websocket简介

  • websocket定义

    • WebSocket 是一种在单个TCP连接上进行全双工通信的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。

    • 在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接, 并进行双向数据传输。

    • WebSocket本质上一种计算机网络应用层的协议,用来弥补http协议在持久通信能力上的不足。

    • WebSocket 协议在2008年诞生,2011年成为国际标准。现在最新版本浏览器都已经支持了。

    • 它的最大特点就是,服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息,是真正的双向平等对话,属于服务器推送技术的一种。

  • websocket特点

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

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

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

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

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

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

2.websocket和http的区别和联系

  • 联系
    二者都基于TCP,都是可靠性传输协议。 WebSocket在建立握手时,数据是通过HTTP传输的。但是建立之后,在真正传输时候是不需要HTTP协议的。

  • 区别

    WebSocket是双向通信协议,模拟Socket协议,可以双向发送或接受信息,而HTTP是单向的;

    WebSocket是需要浏览器和服务器握手进行建立连接的,而http是浏览器发起向服务器的连接。

二者通信图如下所示:

img

3.websocket工作原理

http协议建立通道后,在此基础上用真正的websocket协议进行通信。

websocket是一个持久化的协议。

在一个http连接中,可以发送多个request,接收多个response,一个request对应一个response。当所有请求都收到响应后,http请求就结束了。注意所有response都是被动的,等待request发起后才能有response。

  1. 以下是websocket握手协议发送的请求信息
1
2
3
4
5
6
7
8
GET /chat HTTP/1.1
Host: server.example.com
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: x3JJHMbDL1EzLkh9GBhXDw==
Sec-WebSocket-Protocol: chat, superchat
Sec-WebSocket-Version: 13
Origin: http://example.com

其中Upgrade: websocket等于告诉服务器发起的请求类型是websocket协议。Sec-WebSocket-Key是一个 Base64 encode 的值,这个是浏览器随机生成的验证码。 Sec-WebSocket-Version是告诉服务器所使用的协议版本。

  1. 服务器收到请求后会返回以下信息:
1
2
3
4
5
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: HSmrc0sMlYUkAGmm5OPpG2HaGWk=
Sec-WebSocket-Protocol: chat

此时表示已接收到请求,代表websocket已成功建立。

  1. 接下来http会告诉客户切换的协议是websocket:
1
2
Upgrade: websocket
Connection: Upgrade
  • 总结:

    上述步骤可以概括为以下过程,首先,客户端发起http请求,经过3次握手后,建立起TCP连接;http请求里存放WebSocket支持的版本号等信息,如:Upgrade、Connection、WebSocket-Version等;

    然后,服务器收到客户端的握手请求后,同样采用HTTP协议回馈数据

    最后,客户端收到连接成功的消息后,开始借助于TCP传输信道进行全双工通信。

4.websocket应用场景

  • 使用websocket技术的工作往往具备以下两点特征:

(1)提供多个用户相互交流

(2)需要展示服务器端经常变动的数据

  • 例如:
    • 社交订阅;对社交类的应用的一个裨益之处就是能够即时的知道你的朋友正在做什么。
    • 多玩家游戏;在不使用插件(我指的是Flash)的情况下,网络开发者现在可以在浏览器中实现和体验高性能的游戏。
    • 协同编辑;通过一个协同解决方案,比如WebSocket,我们能够工作在同一个文档,从而省去所有的合并版本
    • 点击流数据;使用Websocket,你可以由客户端发送不受限制的数据。想要在除页面加载之外跟踪鼠标的移动,只需要通过WebSocket连接发送这些数据到服务器,并存储在数据库中就可以了。现在你可以通过回放用户在页面的动作来清楚的知道发生了什么。
    • 股票基金报价;使用WebSocket可以流式更新这些数据变化而不需要等待。
    • 体育/游戏实况更新;如果你在你的网站应用中包含了体育新闻,WebSocket能够助力你的用户获得实时的更新。
    • 即时聊天通信
    • 实时地图数据;
    • 在线教育

tips:如果我们要获取旧数据,或者只想获取一次数据供应用程序使用,则应该使用HTTP协议,不需要很频繁或仅获取一次的数据可以通过简单的HTTP请求查询,因此在这种情况下最好不要使用WebSocket

5.websocket常用api

HTML5 WebSocket | 菜鸟教程 (runoob.com)