WebSocket在容器化管理平台的应用

本文涉及的产品
容器镜像服务 ACR,镜像仓库100个 不限时长
简介:

介绍

Websocket是一个持久化协议,相对于HTTP这种非持久协议而言。它实现了浏览器与服务器全双工通信,能更好的节省服务器资源和带宽并达到实时通讯的目的,与HTTP一样基于已建立的TCP连接来传输数据。但是与HTTP协议不同的地方就是:WebSocket是一种双向通信协议,在建立连接后,WebSocket服务器端和客户端都能主动向对方发送或接收数据,就像Socket一样;WebSocket需要像TCP一样,先建立连接,连接成功后才能相互通信。

运行机制

传统的HTTP客户端与服务器请求响应模式,一个生命周期里只有一个或多个请求和一个或多个与之对应的响应。 如下所示:

而WebSocket模式下客户端与服务器响应模式,一旦WebSocket连接建立,在客户端或者服务端中断连接前,数据都以帧序列传输,不需要重启客户端或者服务端重新发起连接请求。

1.客户端发起请求


 
 
  1. Request Method:GET 
  2. Status Code:101 Switching Protocols #101之后的数据传输采用Websocket协议 
  3. Connection:Upgrade 
  4. Sec-WebSocket-Extensions:permessage-deflate; 
  5. Sec-WebSocket-Key:dfQAy9mlQ0EjD5MmvvsZaQ== #验证 
  6. Sec-WebSocket-Version:13 
  7. Upgrade:websocket #客户端支持websocket协议,如果服务器也支持就使用WebSocket协议 

2.服务器解析,并返回握手信息,建立连接


 
 
  1. Connection:upgrade 
  2. sec-websocket-accept:+mKC4huknIfMGJFOzclP9fO058g= #验证 
  3. upgrade:websocket 

3.传输数据(双向)

4.断开连接

应用场景

WebSocket属于Web领域的实时推送技术,目的让用户不刷新浏览器就可以实时更新。其在容器化管理平台里主要有两个应用场景类型,一个是实时消息类,将实时日志、业务监控等相关信息推送给客户端。如:在容器化管理平台里部署了一个应用,那么应用部署的日志、运行日志以及监控信息如何及时推送到前端呢,另外一个就是交互消息类,在Web界面操作容器,节省手动登录服务器进入容器内的时间,提高效率。

实例1:实时消息

就拿云帮而言,需要实时推送的是每个应用的日志信息和业务监控数据。那么我们在处理实时消息时就采用了WebSocket与ZMQ相结合的方式,快速实现将应用日志信息推送到web端。其简化模型如下所示:

客户端与服务器采用WebSocket协议,实时传输相关数据。相关数据方面采用的是ZMQ。云帮主要使用了ZeroMQ消息队列中的Publisher-Subscriber模型,将所有相关信息汇总到一个节点上在推送到其他节点上。即客户端(SUB)向服务器(PUB)订阅消息,然后服务器将消息推送到所有订阅了消息到客户端,类似于广播。之所以采用ZMQ,而不是Socket的原因,前者支持N:M的连接,后者只能1:1的连接。其消息队列模型示意图:

具体的应用场景相关设定参数:


 
 
  1. #docker-compose.yml 
  2. mpush: 
  3.   container_name: mpush 
  4.   environment: 
  5.   - ZMQ_SUB_FROM=tcp://ip:9242 
  6.   image: hub.goodrain.com/dc-deploy/mpush 
  7.   log_driver: json-file 
  8.   log_opt: 
  9.     max-size: 50m 
  10.   ports: 
  11.   - 0.0.0.0:6060:6060 
  12.   restart: always 
  13.  
  14. #config.py 定义实时消息URL 
  15. WEBSOCKET_URL = { 
  16.     'cloudbang''ws://ip:6060/websocket'
  17. #dalaran_docker 
  18. ZMQ_BIND_SUB=tcp://0.0.0.0:9241 
  19. ZMQ_BIND_PUB=tcp://0.0.0.0:9242 
  20. ZMQ_BIND_PUB2=tcp://0.0.0.0:9243 
  21. #setting 
  22. 'docker_sub': { 
  23.         'address': [ 
  24.             'tcp://ip:9242' 
  25.         ], 
  26.         'storage''/data/docker_logs' 
  27.     }, 

实例2:交互消息

GoTTY是一个用Go语言开发的工具,可以将操作系统的命令字符终端共享成普通的网页应用展示出来。 在mac安装根据情况选择一种


 
 
  1. #brew 
  2. brew tap yudai/gotty 
  3. brew install gotty 
  4. #go 
  5. go get github.com/yudai/gotty 

使用:


 
 
  1. gotty -a 0.0.0.0 -p '8080' -w tmux 

那么在云帮,我们又是如何解决这个问题的? 云帮web端操作容器就是基于gotty定制开发的WebSocket共享字符终端。 创建一个websocket实例,连接服务器进行前后台交互及相关事件处理


 
 
  1. #前端实现部分代码 
  2. var openWs = function() { 
  3.         if(is_community == "True"){ 
  4.             host_name = window.location.hostname+":8188"
  5.         } 
  6.         var url = tmp_url.replace("{{DOCKER_WSS_URL}}",host_name) 
  7.         console.log(url) 
  8.         var ws = new WebSocket(url); 
  9.         var term; 
  10.         var pingTimer; 
  11.         ws.onopen = function(event) { 
  12.             ws.send(JSON.stringify({ T_id: t_id, S_id: s_id, C_id: c_id, Md5: md5,})); 
  13.             pingTimer = setInterval(sendPing, 30 * 1000, ws); 
  14.             hterm.defaultStorage = new lib.Storage.Local(); 
  15.             hterm.defaultStorage.clear(); 
  16.             term = new hterm.Terminal(); 
  17.             term.getPrefs().set("send-encoding""raw"); 
  18.             term.onTerminalReady = function() { 
  19.                 var io = term.io.push(); 
  20.                 io.onVTKeystroke = function(str) { 
  21.                     ws.send("0" + str); 
  22.                 }; 
  23.                 io.sendString = io.onVTKeystroke; 
  24.                 io.onTerminalResize = function(columns, rows) { 
  25.                     ws.send( 
  26.                         "2" + JSON.stringify( 
  27.                             { 
  28.                                 columns: columns, 
  29.                                 rowsrows
  30.                             } 
  31.                         ) 
  32.                     ) 
  33.                 }; 
  34.                 term.installKeyboard(); 
  35.             }; 
  36.             term.decorate(document.getElementById("terminal")); 
  37.         }; 

后端程序基于Gotty开发的。


本文作者:佚名

来源:51CTO

相关实践学习
通过日志服务实现云资源OSS的安全审计
本实验介绍如何通过日志服务实现云资源OSS的安全审计。
相关文章
|
JSON Dubbo 测试技术
逐步教你如何在Postman中导入Swagger API
在现代软件开发中,Swagger 和 Postman 作为 API 设计、开发和测试的利器,都被广泛应用。可以将 Swagger 定义的 API 导入到 Postman 中,充分利用 Postman 强大的测试特性对接口进行深入测试。
|
安全 JavaScript Java
记一次网站全站http升级为https的过程,websocket : ws升级为wss遇到的问题等
记一次网站全站http升级为https的过程,websocket : ws升级为wss遇到的问题等
2399 0
记一次网站全站http升级为https的过程,websocket : ws升级为wss遇到的问题等
|
搜索推荐 机器人 数据处理
基于大语言模型的 FireRedTTS 语音合成系统
【10月更文挑战第3天】近年来,随着人工智能技术的发展,基于大语言模型的语音合成系统备受关注。FireRedTTS 系统由郭浩瀚等人提出,旨在满足多样化的语音合成需求。该系统分为数据处理、基础系统和下游应用三部分,通过高质量数据集和语义感知架构生成高保真语音信号。其应用场景包括配音和聊天机器人,能够实现零样本语音克隆和可控类人语音合成,提供自然且个性化的交互体验。然而,系统仍面临计算资源和完全自然语音合成等方面的挑战。[了解更多](https://arxiv.org/abs/2409.03283)
997 3
|
JavaScript PHP UED
【PHP开发专栏】PHP与WebSocket实时通信
【4月更文挑战第30天】本文介绍了PHP实现WebSocket实时通信的原理、使用方法和实际案例。WebSocket是基于HTTP的全双工通信协议,PHP 5.4以上版本支持WebSocket,可通过内置函数或第三方库如Socket.io、PHP-WebSocket来实现。文章详细展示了创建WebSocket服务器和客户端的PHP代码示例,并提及在PHP中使用Socket.io库进行实时通信。
692 2
|
机器学习/深度学习 算法
探索机器学习在金融风控中的应用
本文将深入探讨机器学习技术如何革新金融风控领域,包括算法选择、模型构建以及实际应用案例。我们将通过具体数据和实验结果来揭示机器学习在提高风险识别准确性和操作效率方面的潜力。文章旨在为金融科技从业者提供实战指南,同时为研究人员指明未来研究的方向。
|
存储 消息中间件 运维
Elasticsearch 结合大数据产品最佳实践
本文整理自阿里云解决方案架构师闫勖勉(三秋)在 阿里云Elasticsearch 自研引擎年度发布 的演讲。
1660 0
Elasticsearch 结合大数据产品最佳实践
|
网络协议 Java 应用服务中间件
如何将本地websocket发布至公网并实现远程访问服务端
如何将本地websocket发布至公网并实现远程访问服务端
489 0
|
JavaScript 小程序
VUE3(三十五)vite构建的项目配置使用.env文件
VUE3(三十五)vite构建的项目配置使用.env文件如标题所示:我要在vue3项目使用.env文件。 先介绍一下项目背景,项目使用VUE3.2 + vite2.9 + typescript搭建。 我基本断定,vue3使用.env文件的方法可能和vue2使用.env文件的方法可能是不同,关于vue2项目如何使用.env文件,请移步《VUE2(七)VUE配置env文件使用》
679 1
|
Ubuntu Linux
ffmpeg编译x265
ffmpeg编译x265
867 0
ffmpeg编译x265
element plus 上传图片到后端功能
element plus 上传图片到后端功能
362 0