# AutoPageFlow

**Repository Path**: handsome-npc/auto-page-flow

## Basic Information

- **Project Name**: AutoPageFlow
- **Description**: 一款基于 AI 的 Chrome 扩展，通过自然语言对话帮您自动完成各种网页操作
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 3
- **Forks**: 0
- **Created**: 2025-12-18
- **Last Updated**: 2025-12-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# AutoPageFlow 智能网页助手

🤖 一款基于 AI 的 Chrome 扩展，通过自然语言对话帮您自动完成各种网页操作

> 💡 **欢迎贡献！** 这是一个开源项目，欢迎提交 Issue、Pull Request 或分享使用经验！

## 🌟 项目介绍

### 项目地址

- 🚀 **GitHub**: https://github.com/HandsomeNPC/AutoPageFlow
- 🇨🇳 **Gitee**: https://gitee.com/handsome-npc/auto-page-flow

## ✨ 主要功能

- **🗣️ 自然语言控制**：用对话的方式告诉浏览器该做什么
- **🧠 智能理解**：AI 理解您的意图并自动分析页面
- **⚡ 自动执行**：自动点击、填写表单、导航等操作
- **📸 实时反馈**：显示 AI 的思考过程和操作状态
- **⌨️ 快捷语句**：保存常用指令，一键执行
- **⌨️ 多平台agent**：支持多个平台agent,如直接调用模型、maxkb平台、coze平台(待实现)

## 🚀 安装使用

### 1. 安装扩展

1. 下载项目代码：
```bash
git clone https://github.com/your-repo/AutoPageFlow.git
cd AutoPageFlow
```

2. 安装依赖：
```bash
npm install
```

3. 构建项目：
```bash
npm run build
```

4. 在 Chrome 中加载扩展：
   - 打开 Chrome 扩展管理页面（地址栏输入：`chrome://extensions/`）
   - 打开右上角的「开发者模式」开关
   - 点击「加载未压缩的扩展程序」
   - 选择项目中的 `dist` 文件夹

### 2. 配置 Agent

AutoPageFlow 支持多种智能体平台，请根据你的需求选择并配置：

#### 配置方式：

1. 首次使用时，点击右上角的「智能体管理按钮」
2. 选择智能体类型（OpenAI 兼容 API、MaxKB 等）
3. 根据选择的类型填写相应配置
4. 保存配置后,点击切换智能体即可使用

#### 详细配置文档：

- **📖 [OpenAI 兼容 API 配置指南](./doc/agentConfigGuide/model.md)** - 支持 OpenAI、通义千问等
- **📖 [MaxKB 平台配置指南](./doc/agentConfigGuide/maxkb.md)** - 使用 MaxKB 知识库增强的智能体

### 3. 开始使用

配置完成后，侧边栏会自动显示。您可以：

1. **直接对话**：在输入框中输入您的需求，例如："打开百度"

2. **使用快捷语句**：点击底部的「配置快捷语句」添加常用指令，之后可以一键使用

### 快捷语句设置

对于经常使用的指令，可以设置为快捷语句：

1. 点击「配置快捷语句」
2. 输入名称和指令内容
3. 保存后，在聊天界面底部会显示快捷语句按钮
4. 点击按钮即可快速使用

## 🤝 欢迎贡献

AutoPageFlow 是一个开源项目，欢迎所有形式的贡献！

### 如何贡献

1. **报告问题**：发现 Bug 或有功能建议，请在 GitHub 提交 Issue
2. **提交代码**：
   - Fork 本项目
   - 创建功能分支：`git checkout -b feature/amazing-feature`
   - 提交更改：`git commit -m 'Add amazing feature'`
   - 推送分支：`git push origin feature/amazing-feature`
   - 提交 Pull Request

3. **改进文档**：帮助完善使用说明、添加示例等
4. **分享经验**：分享您的使用技巧和场景

### 开发方向

我们欢迎以下方向的贡献：

- 🔌 **更多操作**：支持拖拽、快捷键等高级操作
- 🎨 **界面美化**：优化用户体验
- 📝 **更丰富的使用示例**：欢迎开发者贡献示例提示词，放在 `communityPrompt` 文件夹中

## ☕ 支持作者

如果这个项目对您有帮助，欢迎请作者吃个麦当劳 1+1 套餐！您的支持是我们继续开发的动力～

<div align="center">
  <table>
    <tr>
      <td align="center">
        <img src="doc/Qrcode_Wechat.png" alt="微信收款码" width="300">
        <br>微信支付
      </td>
      <td align="center">
        <img src="doc/Qrcode_Alipay.png" alt="支付宝收款码" width="300">
        <br>支付宝
      </td>
    </tr>
  </table>
</div>

## 📄 开源协议

本项目采用 MIT 协议，详见 [LICENSE](LICENSE) 文件。

---

**🌟 如果觉得有用，请给个 Star 支持一下！**

有问题或建议？欢迎在 GitHub 提交 Issue 或联系作者。