震惊！Web 业务系统截图监控平台源代码已开源

qq_36936192

484人浏览 · 2026-04-30 10:21:09

qq_36936192 · 2026-04-30 10:21:09 发布

一个基于 Python Flask + Selenium 的 Web 业务系统自动截图与远程监控工具。

✨ 功能亮点

🔍 自动登录截图：使用无头 Chrome 自动登录业务系统，定时截取页面。
📊 多业务并行监控：支持同时监控多个业务系统，独立配置间隔与登录信息。
👥 多用户隔离：管理员可管理所有设备与用户；普通用户只看到自己的设备。
📁 历史截图浏览：网页端查看历史截图、下载原图、自由删除。
⚡ 实时推送：WebSocket 实时通知新截图（或轮询方式）。
🛠️ Web 管理面板：完全通过网页管理设备、用户，无需修改代码。
📦 单文件打包：支持 PyInstaller 打包为独立 EXE，便于离线部署。

🖥️ 界面截图

（此处可放置截图，例如登录页、仪表盘、监控页、设备管理等）

🛠️ 技术栈

分类	技术
后端	Python 3, Flask, Flask-SocketIO
前端	HTML5, CSS3, JavaScript (jQuery / Fetch)
浏览器自动化	Selenium, ChromeDriver, webdriver-manager (开发)
图像处理	Pillow
打包部署	PyInstaller (可选)

📦 快速开始（开发模式）

环境要求

Python 3.8+
Google Chrome 浏览器

安装依赖

git clone https://github.com/yourname/screen-monitor.git
cd screen-monitor
pip install -r requirements.txt

requirements.txt 内容：

flask
flask-socketio
pillow
selenium
webdriver-manager

启动服务

python app.py

服务默认运行在 http://localhost:5001。

🔐 默认账号

用户名	密码	角色
admin	password	管理员
user1	111111	普通用户

🚀 使用指南

登录
用管理员账号登录后，点击「设备管理」进入管理界面。
添加监控设备
填写设备 ID、名称、归属用户、目标网站 URL、登录账号密码、截图间隔等。
可指定自定义的 CSS 选择器用于定位登录表单（留空则自动探测）。
启动监控
保存设备后，后台线程立即开始定时截图，新截图会实时推送到监控页面。
查看截图
返回仪表盘，点击对应设备的「实时监控」进入监控视图，左侧历史列表动态更新。
用户管理
管理员可通过「用户管理」页面新增、编辑、删除用户。

📁 项目结构

screen-monitor/
├── app.py                    # 主程序
├── requirements.txt          # Python 依赖
├── templates/                # 前端模板
│   ├── login.html
│   ├── dashboard.html
│   ├── monitor.html
│   ├── admin_devices.html
│   └── admin_users.html
├── uploads/                  # 截图原图（自动创建）
├── thumbs/                   # 缩略图（自动创建）
├── devices.json              # 设备配置（自动生成）
├── users.json                # 用户配置（自动生成）
└── chromedriver.exe          # （打包时需准备的本地驱动）

🧪 打包为独立 EXE（可选）

确认本地 Chrome 版本，并下载对应 chromedriver.exe
放入项目根目录。
执行打包命令

python -m PyInstaller --onefile --console --name "ScreenMonitor" ^
    --add-data "templates;templates" ^
    --hidden-import flask_socketio ^
    --hidden-import engineio.async_drivers.threading ^
    --hidden-import PIL._imaging ^
    --hidden-import selenium.webdriver.common.by ^
    --hidden-import selenium.webdriver.chrome.webdriver ^
    --hidden-import selenium.webdriver.chrome.options ^
    --hidden-import selenium.webdriver.chrome.service ^
    --hidden-import selenium.webdriver.support.ui ^
    --hidden-import selenium.webdriver.support.expected_conditions ^
    --exclude-module gevent ^
    --exclude-module eventlet ^
    --exclude-module greenlet ^
    --exclude-module geventwebsocket ^
    app.py