WebSocket的理解以及应用场景

简介: WebSocket的理解以及应用场景

一、对 WebSocket 的理解

WebSocket是HTML5提供的一种浏览器与服务器进行全双工通讯的网络技术,属于应用层协议。它基于TCP传输协议,并复用HTTP的握手通道。浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接, 并进行双向数据传输。

WebSocket 的出现就解决了半双工通信的弊端。它最大的特点是:服务器可以向客户端主动推动消息,客户端也可以主动向服务器推送消息。

WebSocket原理:客户端向 WebSocket 服务器通知一个带有所有接收者ID的事件,服务器接收后立即通知所有活跃的客户端,只有ID在接收者ID序列中的客户端才会处理这个事件。

WebSocket 特点的如下:

支持双向通信,实时性更强

可以发送文本,也可以发送二进制数据‘’

建立在TCP协议之上,服务端的实现比较容易

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

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

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

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

二、Websocket的使用方法如下:

// 在index.html中直接写WebSocket,设置服务端的端口号为 9999
let ws = new WebSocket('ws://localhost:9999');
// 在客户端与服务端建立连接后触发
ws.onopen = function() {
    console.log("Connection open."); 
    ws.send('hello');
};
// 在服务端给客户端发来消息的时候触发
ws.onmessage = function(res) {
    console.log(res);       // 打印的是MessageEvent对象
    console.log(res.data);  // 打印的是收到的消息
};
// 在客户端与服务端建立关闭后触发
ws.onclose = function(evt) {
  console.log("Connection closed.");
}; 

三、应用场景

基于websocket的事实通信的特点,其存在的应用场景大概有:

弹幕

媒体聊天

协同编辑

基于位置的应用

体育实况更新

股票基金报价实时更新


相关文章
|
19天前
|
网络协议 算法
WebSocket 技术详解
【2月更文挑战第12天】
96 1
|
19天前
|
网络协议 数据处理
WebSocket协议基础
WebSocket协议基础
37 0
|
10月前
|
网络协议 数据安全/隐私保护 数据格式
详解WebSocket 以及应用场景?
详解WebSocket 以及应用场景?
304 0
|
17天前
|
网络协议 JavaScript 前端开发
WebSocket:实现客户端与服务器实时通信的技术
WebSocket:实现客户端与服务器实时通信的技术
|
19天前
|
网络协议 JavaScript 前端开发
深入了解WebSocket:实时双向通信的魔法
深入了解WebSocket:实时双向通信的魔法
|
19天前
|
前端开发 网络协议 JavaScript
WebSocket: 实时通信的理解与认识
WebSocket: 实时通信的理解与认识
|
19天前
关于websocket的理解和它与其他通信方式的区别
关于websocket的理解和它与其他通信方式的区别
57 0
|
19天前
|
网络协议 JavaScript 前端开发
WebSocket介绍及部署
WebSocket介绍及部署
127 0
|
7月前
|
网络协议 前端开发 JavaScript
如何在C++ 网络库中支持websocket
如何在C++ 网络库中支持websocket
|
9月前
|
前端开发 API
websocket使用实践代码指南
websocket使用实践代码指南
243 0