阅读全文

⭐⭐⭐ Spring Boot 项目实战	⭐⭐⭐ Spring Cloud 项目实战
《Dubbo 实现原理与源码解析 —— 精品合集》	《Netty 实现原理与源码解析 —— 精品合集》
《Spring 实现原理与源码解析 —— 精品合集》	《MyBatis 实现原理与源码解析 —— 精品合集》
《Spring MVC 实现原理与源码解析 —— 精品合集》	《数据库实体设计合集》
《Spring Boot 实现原理与源码解析 —— 精品合集》	《Java 面试题 + Java 学习指南》

摘要: 原创出处 http://www.iocoder.cn/SkyWalking/ui-1-application/ 「芋道源码」欢迎转载，保留摘要，谢谢！

本文主要基于 SkyWalking 3.2.6 正式版

• 1. 概述
• 2. AllInstanceLastTimeGetHandler
• 3. TraceDagGetHandler
• 666. 彩蛋

---

🙂🙂🙂关注**微信公众号：【芋道源码】**有福利：

1. RocketMQ / MyCAT / Sharding-JDBC 所有源码分析文章列表
2. RocketMQ / MyCAT / Sharding-JDBC 中文注释源码 GitHub 地址
3. 您对于源码的疑问每条留言都将得到认真回复。甚至不知道如何读源码也可以请教噢。
4. 新的源码解析文章实时收到通知。每周更新一篇左右。
5. 认真的源码交流微信群。

---

1. 概述

本文主要分享运维界面的第一部分，应用视角。

SkyWalking WEBUI ：https://github.com/apache/incubator-skywalking-ui

在我们打开 SkyWalking WEBUI 的首页时，如下图：

• 以应用为维度进行展示。
• 紫色部分，时间进度条，调用 「2. AllInstanceLastTimeGetHandler」 接口，获得应用实例最后心跳时间。大多情况下，我们进入该界面，看的是从最后心跳时间开始的应用调用情况。
• 红色部分，应用调用拓扑图，初始化以 [ 实例最后心跳时间前一小时 , 实例最后心跳时间 ] 调用 「3. TraceDagGetHandler」 接口，获得数据，而后每 2 秒刷新一次，30 次刷新后，即过了 1 分钟后，数据范围向前走一分钟，为 [ 实例最后心跳时间前一小时 + 一分钟 , 实例最后心跳时间 + 一分钟 ]。
• 通过进度条的【播放/暂停按钮】可以切换到暂停模式，切换时间范围，查看时间范围为一小时内的应用调用拓扑图。注意，一定要切换到【暂时模式】才可调整时间范围，在【播放模式】下，每次自动请求都会重设时间范围。

基情提示：运维界面相关 HTTP 接口，逻辑简单易懂，笔者写的会比较简略一些。

2. AllInstanceLastTimeGetHandler

org.skywalking.apm.collector.ui.jetty.handler.time.AllInstanceLastTimeGetHandler ，实现 JettyHandler 接口，获得应用实例最后心跳时间处理器。代码如下：

• #pathSpec() ，路径定义，"/time/allInstance" 。
• 响应示例：
• #doGet() 方法，代码如下：
  • 第 55 至 59 行：调用 TimeSynchronousService#allInstanceLastTime() 方法，获得应用实例最后心跳时间。
    • InstanceEsUIDAO#lastHeartBeatTime()
  • 第 61 至 65 行：减 5 秒，因为应用心跳是最频繁的，防止其他信息还没上传。
  • 第 68 至 69 行：返回数据。

3. TraceDagGetHandler

org.skywalking.apm.collector.ui.jetty.handler.TraceDagGetHandler ，实现 JettyHandler 接口，获得应用拓扑图数据逻辑处理器。

• #pathSpec() ，路径定义，"traceDag" 。
• 响应示例：
• #doGet() 方法，代码如下：
  • 第 73 行：调用 TraceDagService#load(startTime, endTime) 方法，获得应用拓扑图数据。代码如下：
    • 第 53 行：调用 NodeComponentEsUIDAO#load(startTime, endTime) 方法，获得 NodeComponent JSON 数组。
    • 第 56 行：调用 NodeMappingEsUIDAO#load(startTime, endTime) 方法，获得 NodeMapping JSON 数组。
    • 第 59 行：调用 NodeReferenceEsUIDAO#load(startTime, endTime) 方法，获得 NodeReference JSON 数组。
    • 第 62 行：调用 TraceDagDataBuilder#build(nodeCompArray, nodesMappingArray, resSumArray) 方法，使用获得的 NodeComponent 、NodeMapping 、NodeReference 数据，构建应用拓扑图。逻辑较为繁琐，笔者已经添加注释，胖友调试一下，很容易明白滴。

666. 彩蛋

水更第一发！

胖友，分享一波朋友圈可好？