125 lines
3.9 KiB
Markdown
125 lines
3.9 KiB
Markdown
# BlurText - 文字模糊保护插件
|
||
|
||
一款简单实用的浏览器扩展，专为屏幕分享和录制场景设计，帮助你快速模糊敏感文字信息，保护隐私安全。
|
||
|
||
## ✨ 功能特点
|
||
|
||
- 🖱️ **一键模糊**：点击即可模糊任意网页文字
|
||
- 🎚️ **可调强度**：5-20px 模糊强度自由调节
|
||
- 🔄 **即点即消**：再次点击取消模糊效果
|
||
- 🗑️ **批量清除**：一键清除所有模糊效果
|
||
- ⚡ **实时生效**：无需刷新，立即看到效果
|
||
- 💾 **模糊记忆**：页面刷新后自动恢复模糊效果
|
||
- 🎯 **三种模式**：元素模式、文本选择模式、区域模式
|
||
- 🔒 **本地处理**：所有数据本地存储，不上传云端
|
||
|
||
## 📦 安装方法
|
||
|
||
### Chrome / Edge / 其他 Chromium 浏览器
|
||
|
||
1. 下载本项目或克隆到本地
|
||
2. 打开浏览器，进入扩展程序管理页面：
|
||
- Chrome: `chrome://extensions/`
|
||
- Edge: `edge://extensions/`
|
||
3. 开启右上角的"开发者模式"
|
||
4. 点击"加载已解压的扩展程序"
|
||
5. 选择本项目的文件夹
|
||
6. 安装完成！
|
||
|
||
## 🎯 使用方法
|
||
|
||
### 基础使用
|
||
|
||
1. 点击浏览器工具栏的 BlurText 图标
|
||
2. 选择模糊模式（元素/文本选择/区域）
|
||
3. 点击"开启模糊模式"按钮
|
||
4. 根据所选模式进行操作：
|
||
- **元素模式**：点击要模糊的元素
|
||
- **文本选择模式**：拖动选择文本，点击浮动按钮
|
||
- **区域模式**：拖动鼠标绘制矩形区域
|
||
5. 按 `ESC` 键退出模糊模式
|
||
|
||
### 模糊记忆功能
|
||
|
||
- 所有模糊效果会自动保存
|
||
- 页面刷新后会自动恢复之前的模糊效果
|
||
- 每个网页的模糊数据独立存储
|
||
- 点击"清除所有模糊"会同时清除存储的数据
|
||
|
||
### 调整模糊强度
|
||
|
||
- 在弹出窗口中拖动"模糊强度"滑块
|
||
- 范围：5px（轻微模糊）到 20px（强烈模糊）
|
||
- 实时生效，无需重新操作
|
||
|
||
### 清除所有模糊
|
||
|
||
- 点击弹出窗口中的"清除所有模糊"按钮
|
||
- 所有模糊效果将立即移除，并清除存储的数据
|
||
|
||
## 💡 使用场景
|
||
|
||
- **技术分享**：录制教程时隐藏 API Key、Token 等敏感信息
|
||
- **在线会议**：演示时保护客户信息、内部数据
|
||
- **直播带货**：展示后台时模糊订单、联系方式
|
||
- **客服工作**：屏幕共享时保护用户隐私
|
||
- **内容创作**：录制视频时快速处理敏感内容
|
||
|
||
## 🔧 技术栈
|
||
|
||
- **Manifest V3**：使用最新的浏览器扩展标准
|
||
- **原生 JavaScript**：无框架依赖，轻量高效
|
||
- **CSS Filter**：使用 CSS `filter: blur()` 实现模糊效果
|
||
- **Chrome Storage API**：本地存储用户配置
|
||
|
||
## 📂 项目结构
|
||
|
||
```
|
||
blurweb/
|
||
├── manifest.json # 扩展配置文件
|
||
├── popup.html # 弹出窗口界面
|
||
├── popup.js # 弹出窗口逻辑
|
||
├── content.js # 内容脚本（核心功能）
|
||
├── content.css # 注入样式
|
||
├── icons/ # 图标文件夹
|
||
│ ├── icon16.png
|
||
│ ├── icon32.png
|
||
│ ├── icon48.png
|
||
│ └── icon128.png
|
||
└── README.md # 说明文档
|
||
```
|
||
|
||
## 🚀 后续计划
|
||
|
||
- [x] 区域模糊（矩形选择）
|
||
- [x] 模糊记忆功能（页面刷新后保持）
|
||
- [ ] 图片模糊功能
|
||
- [ ] 自动识别敏感信息（手机号、身份证等）
|
||
- [ ] 导出/导入配置
|
||
- [ ] 快捷键支持
|
||
- [ ] Firefox 版本
|
||
|
||
## 🤝 贡献
|
||
|
||
欢迎提交 Issue 和 Pull Request！
|
||
|
||
## 📄 许可证
|
||
|
||
MIT License
|
||
|
||
## ⚠️ 注意事项
|
||
|
||
1. ✅ 模糊效果会自动保存，页面刷新后会恢复
|
||
2. 某些动态加载的内容可能需要重新模糊
|
||
3. 模糊效果只是视觉隐藏，不影响网页的实际数据
|
||
4. 建议在正式录制前测试模糊效果
|
||
5. 模糊数据存储在浏览器本地，不会上传到云端
|
||
|
||
## 📞 反馈
|
||
|
||
如有问题或建议，欢迎提交 Issue。
|
||
|
||
---
|
||
|
||
**开发初衷**：为了让屏幕分享和录制更安全、更便捷，不再需要后期打码，节省时间，保护隐私。
|