浏览器插件

浏览器插件是 QT Tool 的配套组件，专门为 CodeSign 平台设计，可以实现切图的自动下载和处理。

功能特性

✅ 自动检测 CodeSign 平台的切图下载
✅ 自动调用本地 QT Tool 处理 ZIP 文件
✅ 支持多种输出配置
✅ 处理历史记录查看
✅ 可配置的服务器地址
✅ 自定义弹窗尺寸

支持的浏览器

Chrome / Chromium
Edge
Brave
其他基于 Chromium 的浏览器

插件架构

组件说明

plug/codesign-qt-helper/
├── manifest.json          # 插件配置
├── package.json           # NPM 配置
├── webpack.config.js      # 打包配置
├── tsconfig.json          # TypeScript 配置
└── src/
    ├── background.ts      # 后台服务
    ├── content.ts         # 内容脚本
    ├── popup/             # 弹窗界面
    │   ├── index.tsx
    │   ├── popup.html
    │   ├── styles.css
    │   └── page/
    │       ├── HomePage.tsx
    │       ├── ConfigPage.tsx
    │       ├── HistoryPage.tsx
    │       └── DialogPage.tsx
    ├── store/             # 状态管理
    │   ├── config-store.ts
    │   └── history-store.ts
    └── net/               # 网络请求
        ├── api.ts
        ├── request.ts
        └── response.ts

权限说明

插件需要以下权限：

storage：存储配置和历史记录
downloads：下载 ZIP 文件
notifications：显示处理结果通知
tabs：访问标签页信息

主机权限

插件仅在以下域名下工作：

*://codesign.qq.com/*
*://*.codesign.qq.com/*

工作原理

1. 自动下载流程

1. 用户在 CodeSign 平台点击下载切图
   ↓
2. Content Script 拦截下载请求
   ↓
3. Background Script 接收下载事件
   ↓
4. 自动下载 ZIP 文件到本地
   ↓
5. 调用本地 QT Tool API 处理文件
   ↓
6. 显示处理结果通知
   ↓
7. 记录处理历史

2. 手动处理流程

1. 用户点击插件图标
   ↓
2. 打开弹窗界面
   ↓
3. 选择配置和文件
   ↓
4. 点击处理按钮
   ↓
5. 调用本地 QT Tool API
   ↓
6. 显示处理结果

核心功能

1. 自动下载

插件会自动检测 CodeSign 平台的切图下载操作，无需用户干预。

触发条件：

当前页面为 CodeSign 平台
用户点击下载切图按钮
下载的文件为 ZIP 格式

自动处理步骤：

拦截下载请求
下载 ZIP 文件到临时目录
获取文件名和路径
调用 /process API 处理文件
显示处理结果

2. 配置管理

插件提供配置页面，用户可以：

设置本地 QT Tool 服务地址
配置弹窗尺寸
测试服务器连接

配置项：

配置项	说明	默认值
serverAddr	服务器地址	`http://localhost:9999`
popupWidth	弹窗宽度	400px
popupHeight	弹窗高度	240px

3. 历史记录

插件自动记录每次处理操作，包括：

处理时间
文件名称
处理状态（成功/失败）
使用的配置

4. 文件检查

在处理前，插件会检查文件是否已存在，避免覆盖。

与 QT Tool 的集成

API 调用

插件通过 HTTP API 与本地 QT Tool 通信：

typescript

// 获取配置列表
GET http://localhost:9999/process/configs

// 检查文件是否存在
POST http://localhost:9999/process/check
{
  "name": "icon.png",
  "config_index": 0
}

// 处理文件
POST http://localhost:9999/process
{
  "name": "icon.png",
  "path": "/path/to/file.zip",
  "config_index": 0
}

错误处理

插件会处理以下错误情况：

服务器连接失败
API 调用超时
文件处理失败
配置错误

下一步

了解如何安装插件
查看插件使用说明
了解 API 文档

浏览器插件 ​

功能特性 ​

支持的浏览器 ​

插件架构 ​

组件说明 ​

权限说明 ​

主机权限 ​

工作原理 ​

1. 自动下载流程 ​

2. 手动处理流程 ​

核心功能 ​

1. 自动下载 ​

2. 配置管理 ​

3. 历史记录 ​

4. 文件检查 ​

与 QT Tool 的集成 ​

API 调用 ​

错误处理 ​

下一步 ​