Skip to content

puppyfront-web/reader-assistant

BranchesTags

Repository files navigation

Reader Assistant

一个强大的 AI 驱动的浏览器扩展，为网页和 PDF 文档提供智能阅读辅助功能，包括内容总结、专业翻译和智能问答。

✨ 主要功能

📝 智能总结 (Summary)

  • 页面总结：一键总结当前网页或 PDF 文档的核心内容
  • 历史记录：自动保存总结历史，按 URL 分类管理
  • 学术模式：自动识别学术论文，提供结构化摘要（目标、方法、结果、影响）
  • 流式输出：实时显示总结内容，支持后台执行
  • 暂停/取消：支持暂停和取消长时间运行的总结任务

💬 智能问答 (Ask)

  • 上下文问答：基于当前页面内容进行智能问答
  • 对话历史：保存所有问答记录，按 URL 分类
  • 多轮对话：支持上下文相关的连续对话
  • 一键清除：快速清除当前页面的对话历史

🌐 专业翻译 (Translate)

  • 沉浸式翻译：逐行翻译，保留原文和译文对照显示
  • 专业翻译：智能保留特殊名词、国家城市名称、技术术语
  • 多语言支持：支持中文、英文、日文、韩文、法文、德文等
  • 实时翻译：翻译结果实时显示在页面上

🎯 选中文本快速操作

  • 快速翻译：选中文本后立即翻译
  • 快速提问：选中文本后快速提问
  • 快速总结：选中文本后快速总结
  • 一键复制：支持富文本格式复制，包括数学公式

🌍 多语言界面

  • 中英文切换：完整的中英文界面支持
  • 自动检测：自动检测浏览器语言
  • 语言记忆：记住用户的语言偏好

🚀 快速开始

安装

  1. 克隆项目

    git clone <repository-url>
cd reader-assistant

  2. 安装依赖

    npm install

  3. 构建项目

    npm run build

  4. 加载扩展

    • 打开 Chrome 浏览器
    • 访问 chrome://extensions/
    • 开启"开发者模式"
    • 点击"加载已解压的扩展程序"
    • 选择项目的 dist 目录

配置

  1. 获取 API Key

    • 访问 OpenAI 官网获取 API Key
    • 或使用其他兼容的 API 服务

  2. 配置扩展

    • 点击浏览器工具栏中的扩展图标
    • 输入 API Key 和 Base URL（可选）
    • 点击"保存"

📖 使用指南

总结功能

  1. 总结当前页面

    • 打开侧边栏，切换到"Summary"标签
    • 点击"总结当前页面"按钮
    • 等待总结完成，结果会自动保存到历史记录

  2. 查看历史记录

    • 在 Summary 标签中查看所有历史总结
    • 支持复制和删除单个总结
    • 支持一键清除所有历史

  3. 快速总结选中文本

    • 选中页面上的文本
    • 点击气泡中的"总结"按钮
    • 结果会自动同步到侧边栏的历史记录

问答功能

  1. 提问

    • 打开侧边栏，切换到"Ask"标签（默认）
    • 在输入框中输入问题
    • 点击"提问"按钮或按 Enter 键
    • 查看 AI 的回答

  2. 查看对话历史

    • 所有问答会自动保存到历史记录
    • 支持查看完整的对话上下文

  3. 快速提问选中文本

    • 选中页面上的文本
    • 点击气泡中的"提问"按钮
    • 结果会自动同步到侧边栏的历史记录

翻译功能

  1. 沉浸式翻译

    • 打开侧边栏，切换到"Translate"标签
    • 选择目标语言
    • 点击"开始沉浸式翻译"按钮
    • 页面内容会逐行翻译并显示在原文旁边

  2. 快速翻译选中文本

    • 选中页面上的文本
    • 点击气泡中的"翻译"按钮
    • 翻译结果会显示在气泡中

  3. 清除翻译

    • 点击"清除"按钮移除所有翻译内容

🛠️ 开发指南

项目结构

reader-assistant/
├── src/
│   ├── background/          # Service Worker（后台脚本）
│   │   └── service-worker.ts
│   ├── content/             # Content Scripts（内容脚本）
│   │   ├── content.ts       # 主内容脚本
│   │   ├── selection-translator.ts  # 选中文本翻译器
│   │   ├── pdf-extractor.ts # PDF 提取器
│   │   └── pdf-translator.ts # PDF 翻译器
│   ├── popup/               # 扩展弹窗（配置界面）
│   │   ├── popup.html
│   │   ├── popup.css
│   │   └── popup.ts
│   ├── services/            # 服务层
│   │   ├── ai-service.ts    # AI 服务
│   │   ├── secure-ai-service.ts  # 安全 AI 服务（Service Worker 代理）
│   │   └── storage.ts       # 存储服务
│   ├── ui/                  # UI 组件
│   │   ├── panel.ts         # 侧边栏面板
│   │   ├── panel-script.ts  # 面板脚本
│   │   ├── panel.html       # 面板 HTML
│   │   ├── panel.css        # 面板样式
│   │   └── quick-chat.ts    # 快速对话气泡
│   └── utils/               # 工具函数
│       ├── i18n.ts          # 国际化
│       ├── copy-utils.ts   # 复制工具
│       ├── constants.ts    # 常量
│       └── types.ts        # 类型定义
├── dist/                    # 构建输出目录
├── manifest.json            # 扩展清单文件
├── package.json             # 项目配置
├── tsconfig.json            # TypeScript 配置
├── webpack.config.js        # Webpack 配置
└── README.md                # 项目说明

开发命令

# 开发模式（监听文件变化）
npm run dev

# 生产构建
npm run build

# 类型检查
npm run type-check

技术栈

  • TypeScript - 类型安全的 JavaScript
  • Webpack - 模块打包工具
  • Chrome Extension API - 浏览器扩展 API
  • PDF.js - PDF 文档处理
  • OpenAI API - AI 服务（兼容其他兼容 API）

代码规范

  • 遵循 SOLID 原则
  • 使用 TypeScript 严格模式
  • 代码风格参考《代码整洁之道》
  • 删除所有 AI 生成的劣质代码和多余注释

🔒 安全说明

API Key 安全

  • ✅ 本地存储：API Key 仅存储在本地（chrome.storage.local），不会同步到云端
  • ✅ 安全提示：在配置界面显示安全提示
  • ✅ Service Worker 代理：支持通过 Service Worker 代理 API 调用（可选）

最佳实践

  1. 使用专用 API Key

    • 为扩展创建专用的 API key
    • 设置使用限额和过期时间
    • 定期轮换 API key

  2. 保护设备安全

    • 使用强密码保护浏览器账户
    • 定期更新浏览器和扩展
    • 避免在公共设备上使用

详细安全说明请参考 SECURITY.md

📋 功能特性

已实现

  • ✅ 智能内容总结（支持网页和 PDF）
  • ✅ 上下文相关的智能问答
  • ✅ 专业沉浸式翻译
  • ✅ 选中文本快速操作
  • ✅ 历史记录管理（按 URL 分类）
  • ✅ 多语言界面支持（中英文）
  • ✅ 富文本复制（支持数学公式）
  • ✅ 流式输出和后台执行
  • ✅ 暂停/取消功能
  • ✅ 自动同步气泡操作到侧边栏

技术特点

  • 🎯 按 URL 存储历史：每个网页的历史记录独立管理
  • 🔄 自动同步：气泡操作自动同步到侧边栏
  • 🌍 多语言支持：完整的中英文界面
  • 📱 响应式设计：适配不同屏幕尺寸
  • ⚡ 性能优化：流式输出，实时反馈
  • 🔒 安全优先：API Key 本地存储，不云端同步

🐛 问题反馈

如果遇到问题或有功能建议，请提交 Issue。

🤝 贡献

欢迎提交 Issue 和 Pull Request！

开发流程

  1. Fork 本项目
  2. 创建功能分支 (git checkout -b feature/AmazingFeature)
  3. 提交更改 (git commit -m 'Add some AmazingFeature')
  4. 推送到分支 (git push origin feature/AmazingFeature)
  5. 开启 Pull Request

📄 许可证

本项目采用 MIT 许可证。

🙏 致谢

  • OpenAI - AI 服务支持
  • PDF.js - PDF 文档处理支持
  • Chrome Extension API - 浏览器扩展平台支持

📝 更新日志

v1.0.0

  • ✅ 初始版本发布
  • ✅ 智能总结功能
  • ✅ 智能问答功能
  • ✅ 专业翻译功能
  • ✅ 多语言界面支持
  • ✅ 历史记录管理
  • ✅ 富文本复制支持

About

chrome 网页助手

Resources

Readme

Security policy

Security policy
Activity

Stars

1 star

Watchers

0 watching

Forks

0 forks
Report repository

Releases

No releases published

Packages

 
 
 

Contributors

Languages