WebSocket 初识篇

本文将基于腾讯云Lighthouse（轻量应用服务器）实例，对WebSocket进行简单的示例演示，以及初步的协议原理探索。帮助大家直观地感受双向通讯的特点以及常见的基于JavaScript的实现方法。

背景概念

WebSocket是近些年适用广泛且流行的网络传输协议，它使得在Web等HTTP协议的应用场景中，可以非常方便地实现类似TCP的全双工通信。这种建立在一个持久连接之上的基于消息的双向通信机制，相比HTTP的Request-Response的事务请求模式，可以让客户端与服务器端的通讯变得丰富和灵活。

WebSocket协议在2011年由IETF组织标准化为RFC6455，浏览器的WebSocket API由W3C标准化被各大主流浏览器全面支持。目前WebSocket已是服务器端向客户端推送数据等功能的标准协议，在站内信、聊天室、新闻推送、视频弹幕发送等多种场景下应用广泛。

示例目标

首先，那么让我们直观感受一下什么是全双工通信的协议。简单说就是在通讯双方可以在任意时刻，根据自身状态向对端发送数据。而不是受限于发送请求/超时前返回等类似HTTP的精简固定模式，就像一直在握着手交谈。

如下图所知，描述了客户端和服务器的一次连接及通信过程。可以看出客户端通过不断探索试探以及根据服务器端的返回，完成了和服务器端友好的“相互沟通”，而非直接地一问一答。

接下来，我们将用最精简的WebSocketAPI以及服务端代码实现类似的功能。

环境准备

工欲善其事，必先利其器。选择一台计算/网络性能强劲且操作简易的云服务器是上路体验的第一步。

目前腾讯云最流行的IaaS级产品莫过于Lighthouse（轻量应用服务器）了。该产品以套餐形式提供了便捷的云主机选购，网络流量包、应用镜像以及免密登录等特性也更加注重了人性化的体验。Lighthouse作为目前最炙手可热的面向个人开发者及中小企业的新一代云服务器产品，特别适合搭建个人博客、网站、论坛、小型应用等多种场景。另外，其良心的价格和促销力度也是前所未有，其持续运营的策略是相对面向未来的。总之，如果需要一台CVM（云服务器），可以考虑先使用Lighthouse。

详细的产品介绍可以参考这里：Lighthouse产品介绍，点击前往 购买传送门，如下图所示：

可以看到，Lighthouse整个购买页只有这一页，步骤也很清晰明确，仅仅需要关注选择镜像和套餐就足够了。

当然也有另一种选择，用Ubuntu/CenteOS等系统镜像，那就需要安装Node.js，其实过程也不复杂。官网下载Node.js最新的x64二进制预编译包，解压到/usr/local目录即可：

sudo tar -C /usr/local --strip-components=1 -Jxvf node-v12.18.3-linux-x64.tar.xz

Lighthouse的“套餐”其实是对CPU/内存/网络的流量带宽等基础资源“打包”的概念，通常根据需要选择即可。对于本文的实验选择最简单的套餐也足够。

然后打开咱们最顺手的JavaScript语言编辑器，准备开始下一步吧。

代码演示

本节我们正式讲解浏览器端WebSocketAPI，以及服务器端Node.js实现的基本方法。

客户端实现

浏览器端两个简单的html/js文件即可：

➜  websocket-example git:(master) ✗ tree client 
client
├── index.html
└── index.js

index.js内容如下：