HTML 5 基础教程

HTML是超文本标记语言，是一种专门用来制作网页的语言，而HTML5就是它的第五个版本，2014年10月29日，万维网联盟宣布，经过接近8年的艰苦努力，该标准规范终于制定完成，该标准针对当前互联网的飞速发展制定了更加标准的网页语言规范及适用功能，同时也给我们开发者带来了更多的开发选择，学习它是每个前端开发者必修的课程。

W3CAPI

2020-06-15 06:59:35

HTML5 WebSocket 简介

什么是HTML5 WebSocket？

概念：WebSocket 是 HTML5 给我们提供的一种数据传输技术的网络协议，基于TCP 连接，可以进行全双工通讯的网络应用层协议。

如何理解：

WebSocket 使得客户端和服务器之间的数据传输交换变得更加方便简单，允许服务端主动向客户端推送数据，实现了客户端可以由主动变为被动的角色转换。在 WebSocket API 中，浏览器和服务器只需要完成一次握手（相对于WebSocket协议来说，TCP协议需要三次握手），两者之间就直接可以创建持久性的连接，并进行双向数据传输。

我们在学习 WebSocket的时候不要纠结于它的概念和实现原理，人类对于任何东西的认识都是基于大脑的形象思维，也就是先自己动手去实现或者去实际看一看它的运作流程，这样就会在我们大脑中形成一种实际存在的轮廓和印象，慢慢的我们对于新事物的形象存储越来越多，自然就会由形象思维拓展到逻辑联系之上，到了这个时候再去理解事物之间的逻辑概念和联系就会轻而易举了，如下图片给大家一个形象上对WebSocket的初步认识：

特性：

在 WebSocket API 中，浏览器和服务器只需要做一次握手的动作（比喻说法，实际上是进行一次请求响应的通信），然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以互相传输数据。
基于TCP协议，数据传输安全稳定
客户端由可以由原来的主动请求转换为被动接收，实现真正意义上的双工通信（可以发送也可以接收数据，HTML5 给我们提供的Server-Send Events 实际上是假的双工通信）

为什么需要HTML5 WebSocket？

如今很多网站为了实现数据的推送功能，使用的技术都是 Ajax 轮询（轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发出HTTP请求，然后由服务器返回最新的数据给客户端的浏览器），这种传统的模式带来很明显的缺点，不仅让浏览器需要不断的向服务器发出请求，影响客户端和服务器的处理性能；然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然这样会浪费很多的带宽等资源。

HTML5 定义的 WebSocket 协议，能更好的节省服务器资源和带宽，并且能够更实时地进行通讯。