设备管理器技术详解
项目概述
本项目是一个基于 Electron + React + C++ 技术栈的跨平台设备管理器（Device Manager），专门用于检测、分析和展示系统中的所有硬件设备信息。该工具能够动态扫描Windows系统中的设备类别，提供类似Windows设备管理器的功能，并支持详细的设备信息展示和管理。
核心特性
- 🔍 全面扫描：动态扫描系统中所有设备类别和设备
- 📊 详细信息：提供设备制造商、驱动信息、硬件ID等详细信息
- 🎨 现代界面：基于React的响应式用户界面
- ⚡ 高性能：C++后端提供高效的设备扫描能力
- 🔧 跨平台：基于Electron的跨平台桌面应用
- 📱 无边框设计：自定义标题栏和窗口控制
- 🌐 中文本地化：完整的中文界面和错误信息
快速开始
环境准备：
- 安装 Visual Studio 2022 和 Windows SDK
- 安装 Node.js 16+ 和 npm/yarn
- 克隆项目代码
编译运行：
# 1. 编译后端C++库
cd codep/backend
mkdir build && cd build
cmake .. && cmake --build .
# 2. 启动前端开发服务器
cd ../../frontend
npm install
npm run dev
生产部署：
# 构建完整应用程序
cd codep/frontend
npm run build
技术架构
整体架构图
┌─────────────────────────────────────────────────────────────┐
│ 前端层 (Frontend) │
├─────────────────────────────────────────────────────────────┤
│ React Components │ Electron Main Process │ DLL Bridge │
│ - MainPage │ - Window Management │ - API Layer │
│ - Sidebar │ - IPC Handlers │ - Memory Mgmt│
│ - ContentArea │ - DLL Loading │ │
└─────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────┐
│ 后端层 (Backend) │
├─────────────────────────────────────────────────────────────┤
│ C++ DLL Library │ Device Scanning │ Data Models │
│ - DeviceManager │ - System Devices │ - Device Info│
│ - LibGlobal │ - Device Categories │ - Categories │
│ - MemoryManager │ - Hardware Detection │ - JSON Export│
└─────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────┐
│ 系统层 (System) │
├─────────────────────────────────────────────────────────────┤
│ Windows API │ Device Manager │ Registry │
│ - SetupAPI │ - Hardware Detection │ - Device Info│
│ - Registry Access │ - Driver Information │ - System Data│
└─────────────────────────────────────────────────────────────┘
技术栈详解
前端技术栈
- Electron 28.0.0：跨平台桌面应用框架
- React 18.2.0：用户界面库
- TypeScript 5.3.0：类型安全的JavaScript
- Tailwind CSS：实用优先的CSS框架
- FontAwesome：图标库
- Vite：快速构建工具
- Koffi：C++ DLL调用库
后端技术栈
- C++17：高性能系统编程语言
- Visual Studio 2022：集成开发环境
- Poco C++ Libraries：跨平台C++库
- Windows SetupAPI：设备管理API
- CMake：跨平台构建系统
- Google Test：单元测试框架
核心模块分析
1. 后端C++模块
1.1 设备管理器 (DeviceManager)
// 核心接口函数
const char* GetDeviceCategories();
功能特点：
- 使用Windows SetupAPI进行设备枚举
- 通过设备类别GUID识别设备类型
- 支持动态扫描所有系统设备类别
- 提供详细的设备属性信息
函数设计模式：
const char* GetDeviceCategories() {
// 局部变量声明
DeviceCategoriesManager manager;
const char* result = nullptr;
// 业务处理
try {
result = manager.getDeviceCategories();
} catch (const std::exception&) {
result = nullptr;
} catch (...) {
result = nullptr;
}
// 清理动作
// 无需要清理的资源
return result;
}
1.2 设备类别管理器 (DeviceCategoriesManager)
核心功能：
- 统一管理所有设备扫描操作
- 动态获取系统设备类别
- 生成标准化的设备信息JSON
- 内存管理和资源清理
设备类别扫描逻辑：
std::vector<DeviceCategory> DeviceCategoriesManager::scanSystemDevices() {
// 局部变量声明
std::vector<DeviceCategory> categories;
Poco::LogStream log(getLogger());
// 业务处理
log.information() << "开始动态扫描系统设备类别，完全模拟Windows设备管理器..." << std::endl;
try {
// 动态获取系统中所有存在的设备类别
auto deviceClassMap = getSystemDeviceClasses();
// 按照Windows设备管理器的显示顺序扫描每个类别
for (const auto& [classGuid, classInfo] : deviceClassMap) {
DeviceCategory category;
category.categoryId = classInfo.categoryId;
category.categoryName = classInfo.categoryName;
category.iconName = classInfo.iconName;
category.devices = scanDeviceClass(classGuid, classInfo.categoryName);
category.deviceCount = static_cast<int>(category.devices.size());
// 只添加有设备的类别
if (category.deviceCount > 0) {
categories.push_back(category);
}
}
} catch (const std::exception& e) {
log.error() << "系统设备扫描失败: " << e.what() << std::endl;
categories.clear();
}
// 清理动作
// 无需要清理的资源
return categories;
}
1.3 设备数据模型
设备类别信息 (DeviceCategory)：
- 基本信息：类别ID、类别名称、设备数量
- 图标信息：类别对应的图标名称
- 设备列表：该类别下的所有设备
设备信息 (DeviceInfo)：
- 基本信息：设备ID、设备名称、设备类型
- 硬件信息：制造商、驱动版本
- 状态信息：设备状态、状态文本
2. 前端React模块
2.1 主页面组件 (MainPage)
核心功能：
- 设备类别加载和展示
- 设备选择管理
- 窗口状态控制
- 系统信息展示
状态管理：
const [selectedDevice, setSelectedDevice] = useState<Device | null>(null);
const [devices, setDevices] = useState<Device[]>([]);
const [deviceCategories, setDeviceCategories] = useState<DeviceCategory[]>([]);
const [isMaximized, setIsMaximized] = useState(false);
const [isLoadingCategories, setIsLoadingCategories] = useState(false);
2.2 侧边栏组件 (Sidebar)
功能特点：
- 设备类别列表展示
- 分类折叠/展开
- 设备状态指示
- 加载状态显示
2.3 内容区域组件 (ContentArea)
功能特点：
- 设备详细信息展示
- 系统信息展示
- 设备统计信息
- 最近活动记录
3. Electron主进程
3.1 DLL桥接器 (DllBridge)
核心功能：
- 管理C++ DLL的加载和调用
- 处理IPC通信
- 内存管理
- 错误处理
export class DllBridge {
private setupIpcHandlers() {
ipcMain.handle('get-device-categories', async (event) => {
return this.dllLoader.getDeviceCategories();
});
ipcMain.handle('init-lib', async (event, jsonInput: string) => {
return this.dllLoader.initLib(jsonInput);
});
}
}
3.2 DLL加载器 (DllLoader)
功能特点：
- 动态加载C++ DLL
- 函数指针管理
- 内存分配和释放
- 错误处理和日志记录
数据流程
1. 设备扫描流程
2. 设备信息处理流程
- 设备发现：通过Windows SetupAPI枚举所有设备
- 类别识别：根据设备类别GUID分类设备
- 信息提取：从注册表和设备属性中提取详细信息
- 数据转换：将C++结构体转换为JSON格式
- 前端展示：React组件渲染设备信息
核心算法
1. 设备类别识别算法
// 动态获取系统设备类别
std::map<GUID, DeviceClassInfo, GuidComparator> DeviceCategoriesManager::getSystemDeviceClasses() {
// 局部变量声明
std::map<GUID, DeviceClassInfo, GuidComparator> deviceClassMap;
HDEVINFO hDevInfo = INVALID_HANDLE_VALUE;
// 业务处理
try {
// 获取所有设备的信息集，只扫描已启用的设备
hDevInfo = SetupDiGetClassDevs(NULL, NULL, NULL, DIGCF_PRESENT | DIGCF_ALLCLASSES);
// 枚举所有设备，收集设备类别信息
for (DWORD deviceIndex = 0; SetupDiEnumDeviceInfo(hDevInfo, deviceIndex, &deviceInfoData); ++deviceIndex) {
// 获取设备类别GUID
if (SetupDiGetDeviceRegistryProperty(hDevInfo, &deviceInfoData, SPDRP_CLASSGUID,
NULL, reinterpret_cast<PBYTE>(classGuidStr), sizeof(classGuidStr), NULL)) {
// 转换GUID字符串
GUID classGuid;
if (CLSIDFromString(classGuidStr, &classGuid) == S_OK) {
// 如果这个类别还没有被记录，则添加它
if (deviceClassMap.find(classGuid) == deviceClassMap.end()) {
DeviceClassInfo classInfo;
classInfo.guid = &classGuid;
classInfo.categoryName = getChineseCategoryName(utf8Name);
classInfo.categoryId = guidStr;
classInfo.iconName = getIconNameForClass(classInfo.categoryName);
deviceClassMap[classGuid] = classInfo;
}
}
}
}
} catch (const std::exception& e) {
// 错误处理
}
// 清理动作（RAII自动处理）
return deviceClassMap;
}
2. 中文本地化算法
std::string DeviceCategoriesManager::getChineseCategoryName(const std::string& englishName) {
// 局部变量声明
std::string chineseName;
// 业务处理
if (englishName == "AudioEndpoint") {
chineseName = "音频端点";
} else if (englishName == "SoftwareDevice") {
chineseName = "软件设备";
} else if (englishName == "USB") {
chineseName = "USB控制器";
} else if (englishName == "Computer") {
chineseName = "计算机";
} else if (englishName == "DiskDrive") {
chineseName = "磁盘驱动器";
} else if (englishName == "Display") {
chineseName = "显示适配器";
} else if (englishName == "Keyboard") {
chineseName = "键盘";
} else if (englishName == "Monitor") {
chineseName = "监视器";
} else if (englishName == "Mouse") {
chineseName = "鼠标";
} else if (englishName == "Net") {
chineseName = "网络适配器";
} else if (englishName == "Ports") {
chineseName = "端口";
} else if (englishName == "Printer") {
chineseName = "打印机";
} else if (englishName == "SCSIAdapter") {
chineseName = "存储控制器";
} else if (englishName == "System") {
chineseName = "系统设备";
} else if (englishName == "HIDClass") {
chineseName = "人机接口设备";
} else if (englishName == "Processor") {
chineseName = "处理器";
} else {
chineseName = englishName; // 如果找不到对应中文，返回原文
}
// 清理动作
// 无需要清理的资源
return chineseName;
}
3. 内存管理策略
// 内存分配和跟踪
class MemoryManager {
public:
static MemoryManager& getInstance();
char* allocateTrackedMemory(size_t size);
void freeTrackedMemory(char* ptr);
void cleanupAllMemory();
private:
std::set<char*> allocatedMemory;
std::mutex memoryMutex;
};
用户界面设计
1. 设计理念
- 现代化：采用现代扁平化设计风格
- 响应式：支持不同窗口尺寸的自适应布局
- 直观性：清晰的信息层次和视觉引导
- 专业性：面向技术人员的专业工具界面
- 中文化：完整的中文界面和错误信息
2. 界面组件
2.1 自定义标题栏
- 无边框窗口设计
- 自定义窗口控制按钮
- 双击标题栏最大化/恢复
- 拖拽移动窗口
图1：设备管理器主界面 - 展示整体布局和自定义标题栏
2.2 设备类别列表
- 分类展示（按设备类别分组）
- 设备状态指示
- 折叠/展开功能
- 实时加载状态
图2：设备类别列表 - 展示按类别分组的设备管理
2.3 详细信息面板
- 分区域信息展示
- 表格化数据呈现
- 系统信息展示
- 设备统计信息
图3：设备详细信息展示 - 包含硬件信息、驱动信息和技术规格
构建和部署
1. 后端构建
开发环境要求：
- Visual Studio 2022 (推荐使用 Community 或 Professional 版本)
- Windows 10/11 SDK
- CMake 3.10 或更高版本
# CMakeLists.txt 配置
cmake_minimum_required(VERSION 3.10)
project (libBackend)
set(CMAKE_CXX_STANDARD 17)
set(CMAKE_CXX_STANDARD_REQUIRED ON)
# 包含Poco库
target_link_libraries(${PROJECT_NAME}
PocoDatad
PocoFoundationd
PocoJSONd
)
2. 前端构建
开发环境要求：
- Node.js 16+
- npm 或 yarn 包管理器
- Git (用于版本控制)
安装依赖：
# 进入前端目录
cd codep/frontend
# 安装项目依赖
npm install
# 或使用 yarn
yarn install
开发模式运行：
# 启动开发服务器 (Vite + Electron)
npm run dev
# 或
yarn dev
生产构建：
# 构建并打包应用程序
npm run build
# 或
yarn build
测试运行：
# 运行端到端测试
npm run test
# 或
yarn test
# 运行测试UI界面
npm run test:ui
# 或
yarn test:ui
package.json 配置：
{
"scripts": {
"dev": "vite",
"build": "tsc && vite build && electron-builder",
"test": "playwright test"
},
"build": {
"appId": "com.devicemanager.app",
"productName": "Device Manager",
"win": {
"target": "nsis"
}
}
}
3. 部署配置
- NSIS安装包：Windows安装程序
- DLL依赖：自动复制依赖库
- 资源文件：包含所有必要资源
- 自动更新：支持应用更新机制
测试策略
1. 单元测试
// Google Test 测试用例
TEST(DeviceManagerTest, GetDeviceCategoriesBasicTest) {
const char* result = GetDeviceCategories();
ASSERT_NE(result, nullptr);
// 验证返回的JSON格式
Poco::JSON::Parser parser;
auto json = parser.parse(result).extract<Poco::JSON::Object::Ptr>();
ASSERT_TRUE(json->getValue<bool>("success"));
}
2. 集成测试
- 端到端测试：使用Playwright进行UI测试
- API测试：验证DLL接口调用
- 性能测试：扫描大量设备的性能测试
- 兼容性测试：不同Windows版本的兼容性
扩展性设计
1. 模块化架构
- 插件系统：支持新的设备类型扫描器
- 接口抽象：统一的设备信息接口
- 配置管理：灵活的扫描选项配置
- 日志系统：可配置的日志级别和输出
2. 未来扩展
- Linux支持：扩展到Linux平台
- 更多设备类型：支持蓝牙、网络设备等
- 设备监控：实时设备状态监控
- 数据导出：支持多种格式的数据导出
技术亮点
1. 跨语言集成
- 无缝集成：C++和JavaScript的无缝数据交换
- 类型安全：TypeScript提供完整的类型检查
- 内存管理：自动化的内存分配和释放
- 错误处理：完善的跨语言错误传递机制
2. 系统级编程
- Windows API：深度使用Windows系统API
- 设备管理：专业的设备枚举和属性获取
- 注册表访问：安全的系统信息读取
- 驱动信息：完整的驱动和硬件信息获取
- Visual Studio 2022：现代化的C++开发体验和调试工具
3. 现代前端技术
- React Hooks：现代化的状态管理
- TypeScript：类型安全的开发体验
- Tailwind CSS：高效的样式开发
- Electron：跨平台桌面应用开发
4. 中文本地化
- 完整中文化：界面、错误信息、日志全部中文化
- 设备类别映射：英文设备类别到中文的智能映射
- 状态文本：设备状态的中文描述
- 用户友好：符合中文用户使用习惯的界面设计
总结
这个设备管理器项目展示了现代桌面应用开发的最佳实践，通过C++后端提供高性能的系统级功能，React前端提供现代化的用户界面，Electron框架实现跨平台部署。项目采用了模块化设计、完善的错误处理、内存管理和测试策略，是一个技术含量较高的专业工具。
该项目的源码将完全开源，为开发者提供了一个完整的跨平台桌面应用开发参考，特别是在系统级编程、跨语言集成、现代前端技术和中文本地化方面具有很高的学习价值。
作者信息
网站： www.itgather.com
邮箱： itgather@163.com
公众号： 全栈代码工坊
本文首发于 IT Gather 技术社区，欢迎关注我们的公众号获取更多技术分享。
附件下载
网页分享： 设备管理器.rar
小通密码： ctfile://xtc17802766-f8438161517-8e4918-1150
下载方法： 打开城通网盘客户端或APP，输入小通密码即可下载
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
