前端如何实现即时通信？

严格意义上：HTTP协议只能做到客户端请求服务器，服务器做出响应，做不到容服务器主动给客户端推送信息

哪个如果服务器数据更新了，想要即时通知客户端怎么呢？（即时通信需求）

即时通信需求：服务器一有更新，希望推送给浏览器

面试提问的回答重心（重点）：

1. 即时通信有哪些方案？
2. 为什么使用了其中的某一个方案！（websocket）

基于Web的前端，存在以下可实现即时通信的方式：

• 短轮询（历史方案）

        开启个定时器，每隔一短时间发送请求（实时性不强）

• Comet - ajax 长轮询（历史方案）

        发送一个请求，服务器只要数据不更新，就一直阻塞（服务器压力过大）

• SSE

        利用了 http协议，流数据的传输并不是严格意义的双向通信，无法复用连接

• Websocket（主流）

        性能和效率都高

短轮询（历史方案）

        短轮询就是客户端定时发送请求，获取服务器上的最新数据。不是真正的即时通信，但一定程度上可以模拟即时通信的效果

优缺点： 

• 优：浏览器兼容性好，实现简单 setInterval
• 缺：实时性不高，资源消耗高，存在较多无用请求，影响性能

Comet - ajax长轮询（历史方案）

短轮询的实时性着是太差，所以 Comet技术方法应运而生，用以实现即时通信

使用 Ajax 长轮询（long - polling）

• 浏览器发出 XMLHttpRequest 请求，服务器接收到请求后，会阻塞请求直到有数据或者超时才返回
• 浏览器 js在处理返回信息（有数据或者超时）后，再次发出请求。服务器收到请求后，会再次阻塞到有数据或者超时才返回

优缺点：

优：浏览器兼容性好， 即时性好，不存在无用请求 

缺：服务器压力较大（维护长连接会消耗较多服务器资源）

SSE

服务端推送事件（Server - Sent Event），它是一种基于HTTP 协议，允许服务端向客户推送新数据的 HTML5技术

问题：HTTP协议 不是 无法做到服务器主动向客户端推送消息么？

这些 SSE 采用了一些小技巧！详细见：参考文章：SSE教程（https://www.ruanyifeng.com/blog/2017/05/server-sent_events.html）​​​​​​

优缺点：

优：基于 HTTP，无需太多改造就能使用，相比较 WebSocket要简单一些

缺： 基于文本传输，效率没有 WebScoket高，基于 HTTP协议，不是严格意义的双向通信

WebSocket（目前主流）

这是基于 TCP协议的全新、独立的协议，作用是在服务器和客户端之间建立实时的双向通信。

WebScoket 协议与 HTTP协议保持兼容，但它不会融入 HTTP协议，仅作为 HTML5 的一部分

优缺点：

优：真正意义上的双向实时通信，性能好、延迟低

缺：由于是独立于 HTTP 的协议，因此要使用的话，需要对项目做改造；使用复杂度会高一些，通常需要引入成熟的库（如：Socket - io）；并且无法兼容低版本的浏览器 

HTTP 和 WebSocket 的连接通信比较图：