后台 py 代码 app.py

'''

服务器cpu监控程序

思路：后端后台线程一旦产生数据，即刻推送至前端。

好处：不需要前端ajax定时查询，节省服务器资源。

作者：hhh5460

时间：2017.8.19

'''

import psutil

import time

from threading import Lock

from flask import Flask, render_template, session, request

from flask_socketio import SocketIO, emit

# Set this variable to "threading", "eventlet" or "gevent" to test the

# different async modes, or leave it set to None for the application to choose

# the best option based on installed packages.

async_mode = None

app = Flask(__name__)

app.config['SECRET_KEY'] = 'secret!'

socketio = SocketIO(app, async_mode=async_mode)

thread = None

thread_lock = Lock()

# 后台线程 产生数据，即刻推送至前端

def background_thread():

    """Example of how to send server generated events to clients."""

    count = 0

    while True:

        socketio.sleep(5)

        count += 1

        t = time.strftime('%M:%S', time.localtime()) # 获取系统时间（只取分:秒）

        cpus = psutil.cpu_percent(interval=None, percpu=True) # 获取系统cpu使用率 non-blocking

        socketio.emit('server_response',

                      {'data': [t, *cpus], 'count': count},

                      namespace='/test') # 注意：这里不需要客户端连接的上下文，默认 broadcast = True ！！！！！！！

@app.route('/')

def index():

    return render_template('index.html', async_mode=socketio.async_mode)

# 与前端建立 socket 连接后，启动后台线程

@socketio.on('connect', namespace='/test')

def test_connect():

    global thread

    with thread_lock:

        if thread is None:

            thread = socketio.start_background_task(target=background_thread)

if __name__ == '__main__':

    socketio.run(app, debug=True)

前端页面 /template/index.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="utf-8">

    <title>ECharts3 Ajax</title>

    <script type="text/javascript" src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>

    <script type="text/javascript" src="//cdn.bootcss.com/socket.io/1.5.1/socket.io.min.js"></script>

    <!-- ECharts 3 引入 -->

    <script src="http://echarts.baidu.com/dist/echarts.min.js"></script>

</head>

<body>

    <!--为ECharts准备一个具备大小（宽高）的Dom-->

    <div id="main" style="height:500px;border:1px solid #ccc;padding:10px;"></div>

    <script type="text/javascript">

    // 作者：hhh5460

    // 时间：2017.8.19

    //--- 折柱 ---

    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: []

        }]

    });

    // 本人笔记本有四个cpu，读者朋友请根据自己的情况，相应修改！！

    // 五个全局变量：time、cpu1、cpu2、cpu3、cpu4

    var 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]

    //准备好统一的 callback 函数

    var update_mychart = function (res) { //res是json格式的response对象

        // 隐藏加载动画

        myChart.hideLoading();

        // 准备数据

        time.push(res.data[0]);

        cpu1.push(parseFloat(res.data[1]));

        cpu2.push(parseFloat(res.data[2]));

        cpu3.push(parseFloat(res.data[3]));

        cpu4.push(parseFloat(res.data[4]));

        if (time.length >= 10){

            time.shift();

            cpu1.shift();

            cpu2.shift();

            cpu3.shift();

            cpu4.shift();

        }

        // 填入数据

        myChart.setOption({

            xAxis: {

                data: time

            },

            series: [{

                name: 'cpu1', // 根据名字对应到相应的系列

                data: cpu1

            },{

                name: 'cpu2',

                data: cpu2

            },{

                name: 'cpu3',

                data: cpu3

            },{

                name: 'cpu4',

                data: cpu4

            }]

        });

    };

    // 首次显示加载动画

    myChart.showLoading();

    // 建立socket连接，等待服务器“推送”数据，用回调函数更新图表

    $(document).ready(function() {

        namespace = '/test';

        var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port + namespace);

        socket.on('server_response', function(res) {

            update_mychart(res);

        });

    });

    </script>

</body>

</html>

效果图

python 服务器 cpu 监控程序--转的更多相关文章

  1. Linux服务器CPU、内存、磁盘空间、负载情况查看python脚本

    [本文出自天外归云的博客园] 网上搜,东拼西凑,组装了一个可以查Linux服务器CPU使用率.内存使用率.磁盘空间占用率.负载情况的python脚本. 脚本内容如下: # -*- coding:utf ...

  2. python服务器环境搭建（3）——参数配置

    前面我们已安装好了python服务器运行所需要的相关软件,而最重要最繁琐的就是参数配置,写这篇就踩了好多坑,花了好多时间,遇到了各种各样的问题.好了费话少说,直接进入本篇话题. PS:本人不是专业的运 ...

  3. asp.net mvc4 简单的服务器监控开发之C#获取服务器CPU、RAM、TCP等系统信息（上）

    一.背景 前段时间服务器出了点问题,加上学业愈来愈紧张,写博文分享的时间越来越少.虽然不是第一次在博客园上写经验,但是近期分享的博文得到了不少的朋友支持和指正,在这里内心非常感激和开心.希望以后能认真 ...

  4. Python应用02 Python服务器进化

    作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! **注意,在Python 3.x中,BaseHTTPServer, SimpleH ...

  5. Python应用01 原始Python服务器

    作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 之前我的Python教程中有人留言,表示只学Python没有用,必须学会一个框架( ...

  6. 服务器CPU使用率高的原因分析与解决办法

    我们的服务器在使用操作系统的时候,用着用着系统就变慢了,打开“ 任务管理器 ”一看,才发现CPU使用率达到80%以上.这是怎么回事情呢?遇到病毒了吗?硬件有问题?还是系统设置有问题呢?在本文中将从硬件 ...

  7. 流行python服务器框架

    流行python服务器框架   1.tonardo---- 多并发.轻量级应用, “非阻塞”的web 容器.类似tomcat.这个大家太熟悉了,就不多说了. 2.Twisted---- Twisted ...

  8. Python网络02 Python服务器进化

    原文:Python网络02 Python服务器进化 作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! **注意,在Python 3. ...

  9. Python网络01 原始Python服务器

    原文:Python网络01 原始Python服务器 作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 之前我的Python教程中有人 ...

随机推荐

  1. maven web项目中运行stucts2报404的解决方案

    从这篇文章看见的https://www.cnblogs.com/xxqxxq/p/5938821.html 1.将stucts.xml中所有<action>全部注释掉,重新运行 如果运行成 ...

  2. jquery 使用on方法给元素绑定事件

    on方法在1.7版本中开始出现的,现在已经优先考虑on,并不是bind方法了. on( events [,selector] [,data] ,handler) event:为事件类型,可以有多个事件 ...

  3. 查询一个redis集群的大keys 脚本

    1. 把redis集群中的 master 节点信息记录在文件 redis_object_port.info 中, 方便下一步遍历各实例中的大 keys redis-cli -h 10.240.47.1 ...

  4. QQ聊天监视器（简易版），可以获取当前QQ进程的聊天窗口内容

    原始出处: https://www.cnblogs.com/Charltsing/p/QQChatsMonitor.html 监视QQ聊天信息有很多种方法,最简易的就是直接抓取聊天窗口内容,一个QQ进 ...

  5. Object 源码阅读

    Object 源码阅读 /** * Object 类是类继承结构的根类,每一个类型都以 Object 作为其父类,包括数组. */ public class Object { private stat ...

  6. redhat下配置SEED DVS6446开发环境2

    ---恢复内容开始--- 1.rpcbind步骤  linux包:portmap安装包 libgssglue-0.1-8.1.el6.i686.rpm libtirpc-0.2.1-1.el6.i68 ...

  7. 阶段3 2.Spring_07.银行转账案例_4 编写事务管理工具类并分析连接和线程解绑

    事务管理工具类 首先需要有connection.并且是当前线程上的connection.声明connectionUtils.提供set方法等着spring来注入 有异常需要放在事务里面 close关闭 ...

  8. Web前端学习书籍

    <Head First HTML5 Programming> 介绍如何利用HTML5来搭建Web应用,包含JavaScript内容. <CSS禅意花园>: 不是入门的书籍,对C ...

  9. UniEAP Platform V5.0建库

    create tablespace platform datafile 'platform.dbf' size 100M reuse autoextend on next 50M; . . drop ...

  10. java：LeakFilling（JS,JQ）

    1.<a href="javascript:void(0)" onclick="dele();"> a标签不使用链接的时候,必须加javascrip ...