WebSocket协议作为HTML5的一部分，实现了浏览器与服务器的全双工通信，避免了HTTP的频繁请求和关闭链接，提高了实时通信效率。相较于传统HTTP协议和长连接，WebSocket通过一次握手建立长链接，减少了资源消耗，特别适合在线聊天系统的实现。虽然WebSocket的兼容性问题需要关注，但通过SockJS等库可以提供兼容性解决方案。
1、WebSocket协议概述
WebSocket protocol 是HTML5一种新的协议。它实现了浏览器与服务器全双工通信(full-duplex)。一开始的握手需要借助HTTP请求完成。
WebSocket是真正实现了全双工通信的服务器向客户端推的互联网技术。
它是一种在单个TCP连接上进行全双工通讯协议。Websocket通信协议与2011年倍IETF定为标准RFC 6455，Websocket API被W3C定为标准。
2、优点：
可实现浏览器与服务器全双工通信(full-duplex)，它可以做到：浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。这个新的协议的特点正好适合这种在线即时通信。
传统的Http协议实现方式：
http协议可以多次请求，因为每次请求之后，都会关闭链接，下次重新请求数据，需要再次打开链接。
说明：
- 基于polling（轮询）技术：以频繁请求方式来保持客户端和服务端的同步
- 问题：客户端的频繁的请求，服务端的数据无变化，造成通信低效
图解：
传统socket技术：
长连接
客户端 --（先连接上去）----- 服务端
好处：可以实现客户端和服务端双向通信
缺点：如果大家都不说话，是不是资源就浪费了
WebSocket协议实现方式：
它是一种长链接，只能通过一次请求来初始化链接，然后所有的请求和响应都是通过这个TCP链接进行通讯，这意味着它是一种基于事件驱动，异步的消息机制
说明：原理和TCP一样，只需做一个握手动作，就可以形成一条快速通道。
图解：
详细的通信过程：
1）客户端发起http请求，附加头信息为：“Upgrade Websocket”
2）服务端解析，并返回握手信息，从而建立连接
3）传输数据（双向）
4）客户端或服务端主动断开连接。客户端主动断开：客户端发起http请求，请求断开连接，服务端收到消息后断开WebSocket连接；服务端主动断开：直接断开WebSocket连接，客户端的API会立刻得知。
websocket的优越性不言自明，长连接的连接资源（线程资源）随着连接数量的增多，必会耗尽，客户端轮询会给服
务器造成很大的压力，而websocket是在物理层非网络层建立一条客户端至服务器的长连接，以此来保证服务器向客
户端的即时推送，既不耗费线程资源，又不会不断向服务器轮询请求。
webscoket和传统http协议的区别
传统的http请求的的rest风格现在很流行，它的作用就是通过rest风格，能够把不同路径的请求映射到同一个方法进行处理。http协议可以多次请求，因为每次请求之后，都会关闭链接，下次重新请求数据，需要再次打开链接。而对于webscoket来说，它是一种长链接，只能通过一次请求来初始化链接，然后所有的请求和响应都是通过这个TCP链接进行通讯，这意味着它是一种基于事件驱动，异步的消息机制，和JMS, AMQP等消息机制的应用差不多。
以前不管使用HTTP轮询或使用TCP长连接等方式制作在线聊天系统，都有天然缺陷，随着Html5的兴起，其中有一个新的协议WebSocket protocol，可实现浏览器与服务器全双工通信(full-duplex)，它可以做到：浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。这个新的协议的特点正好适合这种在线即时通信。
传统的客户端和服务端通信方式：
WebSocket的客户端和服务端通信方式：
说明：
http协议是一种应用层协议，已经定义了请求的格式，例如请求的头部的关键字，还有也定义了，服务器响应数据的格式，它对请求和响应的数据格式做了规范，而websocket协议不同，websocket协议还不够详细，它没有规定请求和接收的数据格式，例如，浏览器想向服务器请求进行socket通讯，但服务器不知道是否要进行socketon通讯，由于这个原因，websocket就定义了一个子协议，也就是浏览器客户端和服务器在请求握手的时候，他们能根据头部的Sec-WebSocket-Protocol，决定是否要进行websocket通讯。当然子协议的使用不是必须的，但是如果不使用子协议，那就必须自己定义一种请求和接收的数据格式规范，然后客户端和服务器都使用这种规范来进行通讯。
-
- 客户端-浏览器的支持
WebSocket通信的客户端使用的是浏览器，客户端操作的API是HTML5中新增的API，使用这些API可以让客户端（浏览器）和服务端（服务器）进行全双工的通讯。
支持的浏览器如下：
| 浏览器类型 |
浏览器版本 |
| Chrome |
Supported in version 4+ |
| Firefox |
Supported in version 4+ |
| Internet Explorer |
Supported in version 10+ |
| Opera |
Supported in version 10+ |
| Safari |
Supported in version 5+ |
问题出现了，Html5 websocket兼容性还不是很好，不是所有的浏览器都支持这些新的API，特别是在IE10以下。
但幸运的是现在绝大多数主流的浏览器都支持这些API，即使不支持的哪些旧的浏览器，也有解决方案。如：
为了处理不同浏览器和浏览器版本的兼容性，spring webscoket基于SockJS protocol提供了一种解决兼容性的方法，在底层屏蔽兼容性的问题，提供统一的，透明的，可理解性的webscoket解决方案。
SockJS 是一个浏览器上运行的 JavaScript 库，如果浏览器不支持 WebSocket，该库可以模拟对 WebSocket 的支持，实现浏览器和 Web 服务器之间低延迟、全双工、跨域的通讯通道。
-
- 服务端-服务器的支持
本课程是基于Java语言开发的，因此服务器只讨论JEE服务器。
新版本的应用服务器新增了支持的API，如Tomcat 7.0.47+等
- 开发环境搭建-基础项目导入
- 整体框架介绍
服务端：Maven+spring mvc+Spring WebSocket+jQuery+Gson
客户端：html5的WebSocket的api
引入pom.xml配置：
| <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>cn.itcast.projects</groupId> <artifactId>chatroomdemo</artifactId> <version>0.0.1-SNAPSHOT</version> <packaging>war</packaging> <name>chatroomdemo</name> <description>聊天室的demo</description> <!-- 自定义属性管理 --> <properties> <!-- 编译等所有操作使用utf-8编码 --> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> <!-- 统一版本维护管理 --> <spring.version>4.2.8.RELEASE</spring.version> <servlet.version>3.1.0</servlet.version> <jsp.version>2.0</jsp.version> <gson.version>2.7</gson.version> <junit.version>4.12</junit.version> </properties> <!-- 依赖管理 --> <dependencies> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-webmvc</artifactId> <version>${spring.version}</version> </dependency> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-websocket</artifactId> <version>${spring.version}</version> </dependency> <dependency> <groupId> |
最低0.47元/天 解锁文章
690
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
