模块 WebUI — 在管理器内的浏览器页面做配置

什么是模块 WebUI

很多功能丰富的模块需要让用户做配置开关、填参数、看日志——这些功能如果全部用脚本命令行实现，用户体验会很差。KernelSU 引入的 WebUI 机制解决了这个问题：模块自带一套简易的 HTML/CSS/JS 页面，嵌入到管理器里显示，用户在 APatch 管理器里点模块就能打开这个页面做设置。

APatch 在 10568 版本引入了 WebUI 支持，实现方式和 KernelSU 完全一致——为 KernelSU 设计的 WebUI 在 APatch 上直接能用。

模块里的 WebUI 文件

如果你的模块要提供 WebUI，在模块根目录下加一个 webroot/ 目录：

module/
├── module.prop
├── webroot/
│   ├── index.html       # WebUI 主页（必须）
│   ├── style.css
│   ├── script.js
│   └── assets/           # 可选的图片等资源
└── service.d/
    └── webui-bridge.sh   # 可选，和内核交互的桥接脚本

index.html 是 WebUI 的入口，用户在管理器里点模块时，管理器会通过内嵌 WebView 加载这个文件。

WebUI 的交互方式

WebUI 和 root 环境之间通信，通常有几种方式：

方式 1：REST API 桥接（最常用）

模块的 service.d 脚本启动一个小型 HTTP 服务器（Python/BusyBox httpd/自实现），WebUI 里用 fetch() 向这个 API 发请求获取状态、执行操作。

方式 2：直接读写文件

简单场景可以让脚本把状态写到 /data/adb/modules/xxx/ 下的文件里，WebUI 通过 API 读取。

方式 3：直接运行命令

WebUI 提交参数 → 桥接脚本收到后执行 root shell 命令 → 把结果返回给 WebUI。

安全注意

WebUI 会在内嵌浏览器里运行 HTML/JS，虽然是本地执行，但：

• 不要加载远程脚本（CDN 引用可能泄露数据）
• 桥接脚本要做权限检查，确保只有管理器能访问
• 不要在 JS 里硬编码密钥或敏感信息

设计规范

KernelSU 维护了一套 WebUI 设计规范，建议遵循：

• 简洁、适配手机屏幕宽度
• 和管理器本身的 Material Design 风格一致
• 避免过度花哨的动效
• 按钮有明确的反馈（加载中 / 成功 / 失败 三态）

更多完整规范见 KernelSU 官方 WebUI 介绍页面。