哈喽，这里是阿森！
没想到距离上次发布已经过去大半年了，
严重拖延症以及近半年一直忙于工作和学习导致每次发布文章都一拖再拖。有很多很不错的点子都没有和大家分享，近一段时间打算不再摸鱼了，把最近想到的一些还不错的想法、技术分享给大家。求大家体谅QAQ
那么就开始这期的白日梦时间吧！！！
事情起因是因为最近为了实现高中时期的梦想，入手了一台十年前的夏普402sh，几经折腾最终不得已承认它确实已经被淘汰，成为时代的眼泪。本着不浪费不抛弃的原则，于是决定废物利用改成主机性能监控副屏。最终成品如下：
本期教程分新手篇和进阶篇。
【新手篇】无需任何基础，你只要会用电脑和手机即可。
【进阶篇】需要一定计算机基础的同学，我们将会尝试通过JavaScript、Python来实时获取来自AIDA64的数据以此实现更多功能。
本期教程所需物品：
能连wifi的手机或者其他设备，不限系统，只要能打开浏览器就行x1
windows电脑x1
路由器x1
【新手篇】
1. 电脑下载【AIDA64】
（一些主板会在第一次进入系统后安装【AIDA64】，比如微星等，如果你的电脑已经安装过，请直接跳到第二步。AIDA64 Extreme版只有30天免费试用，建议直接某宝两块买一个激活码，或者网上找破解版、他人分享的激活码。)
进入AIDA64官网，下滑找到第一个exe版本的，点击download进行下载
跳转下载页面后，选择下载地址，可以无脑选第一个
点击下载好的安装，选择语言点击【确定】
点击【下一步】
选择【我接受协议】，点击【下一步】
自行选择软件安装路径，选择完后点击【下一步】
点击【下一步】
点击【下一步】
点击【安装】
2. 配置【AIDA64】
安装完成后我们双击桌面【AIDA64】运行程序，点击左上角【文件】，点击【设置】
弹出页面点击【常规】，勾选【Windows系统启动时运行AIDA64】，点击右下角【应用】
然后依次点击【硬件监视工具】==>【LCD】
此时在右侧界面选择【RemoteSensor】，【TCP/IP端口号】默认是80，如果不太了解端口号概念可以不做修改，也可以改成和我一样，这个端口号后面要用，是重点，请记住它，【预览分辨率】填和自己手机差不多分辨率即可，手机分辨率一般可以在手机设置中查看，也可以百度搜索自己手机机型找到。上述内容完成后勾选【启用RemoteSensor LCD支持】
接下来就开始设置我们想要展示界面了，左侧菜单点击【LCD项目】进入绘制界面
3. 绘制显示界面
（绘制部分比较复杂，觉得麻烦的同学可以跳过该环节，直接跳转下一步【导入预设主题】）
点击最右侧【新建】正式开始我们的绘制，参考下图选择自己想要展示的数据以及调整部件的样式，调整完后点击【OK】，就会在我们的画布相应位置上展示对应的部件。
4. 导入预设主题
很多同学可能觉得这个绘制的过程太过复杂，其实我们也可以通过点击右侧【导入】的方式导入别人已经预设好的主题，可以在百度搜索他人分享的主题，推荐一篇我找到的他人搬运分享的一组主题的帖子：https://www.bilibili.com/read/cv22991920
请注意，一些主题可能会携带特殊字体，请在导入前双击字体文件安装。
导入时请在文件类型处选择【All files】，避免部分主题找不到。
部分主题由于显示屏幕尺寸不同导致文字错位等问题，建议参考上一步【绘制显示界面】适当调整。
导入完成后点击右下角【OK】
5. 查看电脑局域网ip
按下【win+R】，输入【cmd】后回车进入控制台（黑色窗口），输入【ipconfig】后回车。请记住【IPv4地址】后面这串数字，包括英文符号点的位置，后面要用，很重要！！！！
6. 配置手机
此时，我们距离成功已经不远了，掏出我们准备已久的手机，连接网络（注意，一定要保持手机和电脑处于同一个wifi下），打开手机浏览器，这里我推荐大家下载【X浏览器】，比较轻量，启动快，当然其他浏览器也行。
这里以【X浏览器】作为示例设置，请按下面步骤配置，体验感最佳。如果是其他浏览器，也可参考下方设置。
点击右下角【三】，再点击【齿轮】
进入设置页，点击【基本设置】，【屏幕旋转】选择横屏，打开【保持屏幕常亮】
此时返回首页，点击首页下方【三】，右滑点击【全屏模式】
7. 输入地址
在手机浏览器链接输入框中输入刚才记住的【IPv4地址】+英文冒号+【TCP/IP端口号】，端口号如果是默认的80端口，直接输入【IPv4地址】即可，如果忘记了请返回步骤2和步骤5进行查看。
好了，到这里我们的新手教程结束了，最终显示的效果如下，是不是还挺酷的。接下来就是我们的【进阶篇】了，【进阶篇】我们将会尝试通过JavaScript、Python去获取来自AIDA64的数据来实现更多功能。
【进阶篇】
（注：此教程将会用Python、JavaScript两种方式手把手教你去获取接口数据，进而实现其他功能，没有计算机基础的同学请先学习上述语言后再观看。）
1. 分析数据
我们打开浏览器，输入我们本机IP以及在AIDA64配置的端口号，进入页面后按【F12】打开控制台。在查看页面元素以及网络请求后，学过Web知识的同学都应该明白AIDA64 RemoteSensor LCD的本质就是一个Web服务，通过接口实时获取监测数据，再通过Canvas将数据渲染到页面上。
此时我们在【网络】中找到AIDA64传递数据的接口，就是这个【sse】。
但我们很快发现这个GET请求和我们一般接触到的GET请求类型不太一样。观察瀑布流，这个GET请求的瀑布流一直存在，并随时间越拉越长，并且它的类型也是【eventsource】。
其实这种技术被称为【SSE】（Server-Sent Events），是一种用于实现服务器主动向客户端推送的技术，也被称作【事件流】（Event Stream)，基于HTTP协议。是与长、短轮询、WebSocket并肩的一种实时通信的方式，但与WebSocket不同，SSE只支持单向通信，比较轻量，WebSocket支持双向通信。各有各的优点，想了解的同学可以自行查询，这里不过多赘述。
接下来，我们点击【sse】请求，查看【EventStream】，其中的【数据】一栏便是我们想要的数据。
我们右键复制数据粘贴到空白文档分析数据结构。由分析可得：
Page0|{|}Simple1|CPU 4190MHz|{|}page0对应AIDA64中LCD页面数
剩余部分则是对应部件的代号和部件信息以及对应样式数据，以{|}作为分隔
类型与id、部件信息、样式以|作为分隔，分割后顺序为：类型与id、部件信息、样式
其中，部件信息分为标签、对应数据，以空格作分隔
（注：标签只有在LCD部件中勾选了【Show label】才会有，如下图。一些部件无法展示标签，比如Gph）
2. 获取数据
在我们知道数据结构之后，我们就开始写我们的代码获取这些数据吧。
2.1【Python】
在写Python代码前，控制台输入下面命令安装一下sseclient库。
pip install sseclientfrom sseclient import SSEClient # pip install sseclient
messages = SSEClient('http://IP:端口号/sse') # 连接获取时间流
for msg in messages: # 遍历事件流
# 根据时间流event类型去判断对应的情况
if msg.event == 'message':
if len(str(msg)) != 0: # 事件流中存在空的message，我们去除这些空消息=
# 按{|}分割得到列表并剔除页数
computer_info = str(msg).split('{|}')[1:-1]
# 遍历每项部件数据
for item in computer_info:
# 分割获取下标为1的部件信息
info = item.split('|')[1]
# 获取部件名字
name = info.split(' ')[0]
# 获取对应数据
data = info.split(' ')[1]
print(name)
print(data)
print('=======')运行结果如下：
我们用Python成功爬取到了来自AIDA64实时检测的数据，以此我们可以做很多操作，比如CPU 温度过高自动关机，内存快满了弹出警告，或者使用一些Python GUI库去展示这些数据也行。
2.2【JavaScript】
<script>
//先判断一下浏览器是否支持sse
if (!!window.EventSource) {
//实例化一个EventSource
let source = new EventSource('http://192.168.10.24:9527/sse');
// 创建监听事件，监听来自接口的数据
source.addEventListener('message', function (e) {
msg = e.data
// 按{|}分割得到列表并剔除页数
computer_info = msg.split('{|}').slice(1,-1)
// 遍历每项部件数据
computer_info.forEach(item => {
// 分割获取下标为1的部件信息
info = item.split('|')[1]
// 获取部件名字
name = info.split(' ')[0]
// 获取对应数据
data = info.split(' ')[1]
console.log(name,':',data);
});
}, false);
} else {
console.log("哦吼，你浏览器太垃圾惹");
}
</script>运行结果如下：
我们用JavaScript成功接收到了来自AIDA64实时检测的数据，以此我们可以用更多前端技术去展示这些数据，比如用Vue去做页面，dataV做大屏展示，或者用Echarts去图形化展示，实现的效果将会比LCD自带部件样式更加丰富。
本期推荐就到这里啦。
关注个人微信公众号，及时获取最新文章。
