网站首页 > 技术文章 正文
今天来分享一个有趣的内容,通过 Python + WebSocket + Js 来实现服务监控日志的实时输出,当服务正常时,在页面上实时展示出 OK;当服务不正常时,在页面上会实时展示出加粗的红色内容。分享的内容划分成四部分。
第一部分:HTML 部分
如图所示,红框的 onclick 方法调用到了 js 方法。
第二部分:JS 部分的代码
这里会与后端的 WebSocket Server 建立连接,并将 env 这个变量(参数)传到后端,然后后端会根据 env 来进行服务的检测,然后返回一个响应给到 js,最后 js 拿到了响应后进行追加到我们定义的一个 div 里面,这里也体现了一个实时的服务日志监控展示。
第三部分:WebSocket Server 部分
这里拿到了前端 js 传过来的参数 env,进行环境的匹配,然后遍历每一个服务的请求,再根据请求返回的结果拼接一个 response 给到 js,如下图红框中所示:
第四部分:页面效果展示
总结:
整体上思路要清晰,html 里面通过 onclick 方法调用到 js,js 通过与后端的 WebSocket Server 建立连接,连接后会根据传入的参数来确定检测哪个环境的服务,WebSocket Server 将检测的结果实时返回给 js 处理,js 将结果实时的追加到 html 页面的一个 div 元素中,至此就全部结束了。
猜你喜欢
- 2024-11-22 前端容器化实践
- 2024-11-22 npm audit —— 守护Node.js前端代码安全的小助手
- 2024-11-22 程序员私活利器 (Jfinal)——找到一次请求的所有日志
- 2024-11-22 完美日记的微服务实践和优化思路
- 2024-11-22 线上程序出bug,排查起来很麻烦?一个好的日志系统是关键
- 2024-11-22 MySQL慢查询:慢SQL定位、日志分析与优化方案
- 2024-11-22 ELK Stack实用教程:让你的日志数据发挥更大的价值
- 2024-11-22 干货 | 企业如何快速采集分析日志?
- 2024-11-22 Spring Boot 整合 Apache Spark 进行日志分析?
- 2024-11-22 Windows系统服务器系统日志在哪里查看?
你 发表评论:
欢迎- 07-10Oracle 与 Google Cloud 携手大幅扩展多云服务
- 07-10分享收藏的 oracle 11.2.0.4各平台的下载地址
- 07-10Oracle 和 Microsoft 推出 Oracle Exadata 数据库服务
- 07-10Oracle Database@Azure 推进到南美等新区域并增加了新服务
- 07-10Oracle宣布推出 Oracle Database@AWS 的有限预览版
- 07-10Oracle与Nextcloud合作,推出主权云上的安全协作平台
- 07-10NodeRED魔改版连接MsSql、PostgreSQL、MySQL、OracleDB存储无忧
- 07-10对于企业数据云备份,“多备份”承诺的是成本更低,管理更高效#36氪开放日深圳站#
- 602℃几个Oracle空值处理函数 oracle处理null值的函数
- 594℃Oracle分析函数之Lag和Lead()使用
- 582℃0497-如何将Kerberos的CDH6.1从Oracle JDK 1.8迁移至OpenJDK 1.8
- 579℃Oracle数据库的单、多行函数 oracle执行多个sql语句
- 574℃Oracle 12c PDB迁移(一) oracle迁移到oceanbase
- 567℃【数据统计分析】详解Oracle分组函数之CUBE
- 554℃最佳实践 | 提效 47 倍,制造业生产 Oracle 迁移替换
- 548℃Oracle有哪些常见的函数? oracle中常用的函数
- 最近发表
-
- Oracle 与 Google Cloud 携手大幅扩展多云服务
- 分享收藏的 oracle 11.2.0.4各平台的下载地址
- Oracle 和 Microsoft 推出 Oracle Exadata 数据库服务
- Oracle Database@Azure 推进到南美等新区域并增加了新服务
- Oracle宣布推出 Oracle Database@AWS 的有限预览版
- Oracle与Nextcloud合作,推出主权云上的安全协作平台
- NodeRED魔改版连接MsSql、PostgreSQL、MySQL、OracleDB存储无忧
- 对于企业数据云备份,“多备份”承诺的是成本更低,管理更高效#36氪开放日深圳站#
- 解读丨《归档文件整理规则》— 电子文件元数据存储
- Data Guard跳归档恢复的实践(dataguard failover)
- 标签列表
-
- 前端设计模式 (75)
- 前端性能优化 (51)
- 前端模板 (66)
- 前端跨域 (52)
- 前端缓存 (63)
- 前端aes加密 (58)
- 前端脚手架 (56)
- 前端md5加密 (54)
- 前端路由 (61)
- 前端数组 (73)
- 前端js面试题 (50)
- 前端定时器 (59)
- 前端获取当前时间 (50)
- Oracle RAC (76)
- oracle恢复 (77)
- oracle 删除表 (52)
- oracle 用户名 (80)
- oracle 工具 (55)
- oracle 内存 (55)
- oracle 导出表 (62)
- oracle约束 (54)
- oracle 中文 (51)
- oracle链接 (54)
- oracle的函数 (57)
- 前端调试 (52)
本文暂时没有评论,来添加一个吧(●'◡'●)