flask+sqlite3+echarts3 系统监控-阿里云开发者社区

开发者社区> 罗兵> 正文

flask+sqlite3+echarts3 系统监控

简介: 总的而言,分三部分: 1.监控器(monitor.py): 每秒获取系统的四个cpu的使用率,存入数据库。 2.路由器(app.py): 响应页面的ajax,获取最新的一条或多条数据。 3.页面(index.html): 发出ajax请求,更新echarts图表 一、监控器 使用了psutil库,对系统进行监控。
+关注继续查看

总的而言,分三部分:
1.监控器(monitor.py): 每秒获取系统的四个cpu的使用率,存入数据库。
2.路由器(app.py): 响应页面的ajax,获取最新的一条或多条数据。
3.页面index.html): 发出ajax请求,更新echarts图表

一、监控器

使用了psutil库,对系统进行监控。

import psutil
import sqlite3
import time

'''
说明:四个cpu使用率,显然是临时数据,所以最好用内存数据库,如Redis等
但是这里强行使用sqlite3,不管了,哪个叫他是内置的呢?!
'''

db_name = 'mydb.db'


def create_db():
    # 连接
    conn = sqlite3.connect(db_name)
    c = conn.cursor()

    # 创建表 
    c.execute('''DROP TABLE IF EXISTS cpu''') # 删除旧表,如果存在(因为这是临时数据)
    c.execute('''CREATE TABLE cpu (id INTEGER PRIMARY KEY AUTOINCREMENT, insert_time text,cpu1 float, cpu2 float, cpu3 float, cpu4 float)''')

    # 关闭
    conn.close()


def save_to_db(data):
    '''参数data格式:['00:01',3.5, 5.9, 0.7, 29.6]'''
    # 建立连接
    conn = sqlite3.connect(db_name)
    c = conn.cursor()
    
    # 插入数据
    c.execute('INSERT INTO cpu(insert_time,cpu1,cpu2,cpu3,cpu4) VALUES (?,?,?,?,?)', data)
    
    # 提交!!!
    conn.commit()
    
    # 关闭连接
    conn.close()

    

# 创建表
create_db()

# 通过循环,对系统进行监控
while True:
    # 获取系统cpu使用率(每隔1秒)
    cpus = psutil.cpu_percent(interval=1, percpu=True)
    
    # 获取系统时间(只取分:秒)
    t = time.strftime('%M:%S', time.localtime())
    
    # 保存到数据库
    save_to_db((t, *cpus))

二、路由器

import sqlite3
from flask import Flask, request, render_template, jsonify

app = Flask(__name__)


def get_db():
    db = sqlite3.connect('mydb.db')
    db.row_factory = sqlite3.Row
    return db


def query_db(query, args=(), one=False):
    db = get_db()
    cur = db.execute(query, args)
    db.commit()
    rv = cur.fetchall()
    db.close()
    return (rv[0] if rv else None) if one else rv


@app.route("/", methods=["GET"])
def index():
    return render_template("index.html")


@app.route("/cpu", methods=["POST"])
def cpu():
    if request.method == "POST":
        res = query_db("SELECT * FROM cpu WHERE id>=(?)", args=(int(request.form['id'])+1,)) #返回1+个数据
    
    return jsonify(insert_time = [x[1] for x in res],
                   cpu1 = [x[2] for x in res],
                   cpu2 = [x[3] for x in res], 
                   cpu3 = [x[4] for x in res],
                   cpu4 = [x[5] for x in res]) # 返回json格式


if __name__ == "__main__":
    app.run(debug=True)

三、页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>ECharts3 Ajax</title>
    <script src="{{ url_for('static', filename='jquery-3.1.1.js') }}"></script>
    <script src="{{ url_for('static', filename='echarts.js') }}"></script>
</head>

<body>
    <!--为ECharts准备一个具备大小(宽高)的Dom-->
    <div id="main" style="height:500px;border:1px solid #ccc;padding:10px;"></div>
    
    <script type="text/javascript">
    //--- 折柱 ---
    var myChart = echarts.init(document.getElementById('main'));
    
    myChart.setOption({
        title: {
            text: '服务器系统监控'
        },
        tooltip: {},
        legend: {
            data:['cpu1','cpu2','cpu3','cpu4']
        },
        xAxis: {
            data: []
        },
        yAxis: {},
        series: [{
            name: 'cpu1',
            type: 'line',
            data: []
        },{
            name: 'cpu2',
            type: 'line',
            data: []
        },{
            name: 'cpu3',
            type: 'line',
            data: []
        },{
            name: 'cpu4',
            type: 'line',
            data: []
        }]
    });
    
    
    // 六个全局变量:插入时间、cpu1、cpu2、cpu3、cpu4、 哨兵(用于POST)
    var insert_time = ["","","","","","","","","",""],
        cpu1 = [0,0,0,0,0,0,0,0,0,0],
        cpu2 = [0,0,0,0,0,0,0,0,0,0],
        cpu3 = [0,0,0,0,0,0,0,0,0,0],
        cpu4 = [0,0,0,0,0,0,0,0,0,0],
        
        lastID = 0; // 哨兵,记录上次数据表中的最后id +1(下次查询只要>=lastID)

    
    //准备好统一的 callback 函数
    var update_mychart = function (data) { //data是json格式的response对象
        
        myChart.hideLoading(); // 隐藏加载动画
        
        dataLength = data.insert_time.length; //取回的数据长度
        lastID += dataLength; //哨兵,相应增加。
        
        // 切片是能统一的关键!!
        insert_time = insert_time.slice(dataLength).concat(data.insert_time); // 数组,先切片、再拼接
        cpu1 = cpu1.slice(dataLength).concat(data.cpu1.map(parseFloat)); //注意map方法
        cpu2 = cpu2.slice(dataLength).concat(data.cpu2.map(parseFloat));
        cpu3 = cpu3.slice(dataLength).concat(data.cpu3.map(parseFloat));
        cpu4 = cpu4.slice(dataLength).concat(data.cpu4.map(parseFloat));
        
        // 填入数据
        myChart.setOption({
            xAxis: {
                data: insert_time
            },
            series: [{
                name: 'cpu1', // 根据名字对应到相应的系列
                data: cpu1
            },{
                name: 'cpu2',
                data: cpu2
            },{
                name: 'cpu3',
                data: cpu3
            },{
                name: 'cpu4',
                data: cpu4
            }]
        });
        
        if (dataLength == 0){clearInterval(timeTicket);} //如果取回的数据长度为0,停止ajax
    }
    
    myChart.showLoading(); // 首次显示加载动画
    
    
    // 异步加载数据 (首次,get,显示6个数据)
    $.get('/cpu').done(update_mychart);
    
    
    // 异步更新数据 (以后,定时post,取回1个数据)
    var timeTicket = setInterval(function () {
        $.post('/cpu',{id: lastID}).done(update_mychart);
    }, 3000);
    
    </script>
</body>
</html>

效果图

img_6771324d53e44ae052d413610c9c3ca4.png

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
python os.startfile python实现双击运行程序 python监控windows程序 监控进程不在时重新启动
用python监控您的window服务 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 、作者信息和本声明。否则将追究法律责任。http://world77.blog.51cto.com/414605/782935     最近比较烦,研发给的pc服务版本在虚拟机上已经开始给客户使用了,服务老是莫名的死翘翘,客户不停的电话给我,搞的我心情很差,于是在一个下午,静下心来,用python写了个简单的监控进程的脚本,当发现进程消失的时候,立即调用服务,开启服务。
1613 0
微软轻量级系统监控工具sysmon原理与实现完全分析(上篇)
作者:浪子_三少 Sysmon是微软的一款轻量级的系统监控工具,最开始是由Sysinternals开发的,后来Sysinternals被微软收购,现在属于Sysinternals系列工具。它通过系统服务和驱动程序实现记录进程创建、文件访问以及网络信息的记录,并把相关的信息写入并展示在windows的日志事件里。经常有安全人员使用这款工具去记录并分析系统进程的活动来识别恶意或者异常活动。而本文讨论
1562 0
分布式系统监控体系
分布式系统监控体系
10 0
微软放出首款开源博客内容管理系统Oxite
“开源”两个字通常和微软扯不上太多的联系,不过,今天微软却出乎意料的放出了首款开放源码的博客/CMS内容管理系统,Oxite。软件使用Microsoft Public License (MS-Pl)授权方式,源代码完全公开。
763 0
+关注
罗兵
数学专业。擅数据分析,涉stock、lotto。了解随机过程分析、神经网络。涉web前端、后端。了解vba、js,稍擅python
251
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《Nacos架构&原理》
立即下载
《看见新力量:二》电子书
立即下载
云上自动化运维(CloudOps)白皮书
立即下载