Skip to content

README.md

Latest commit

 

History

History
219 lines (150 loc) · 6.49 KB

README.md

File metadata and controls

219 lines (150 loc) · 6.49 KB
Raw

Prompt 工作流 - AI 提示词工作流工具

English | 简体中文

一个强大的 AI 提示词工作流管理工具，支持创建、编辑、运行多个 Prompt 工作流，集成 OpenAI API，支持变量替换、上下文传递、结果导出等功能。

特性

  • 🚀 纯前端应用 - 无需后端服务器，直接在浏览器中运行
  • 🔄 工作流管理 - 创建、编辑、删除、重命名多个工作流
  • 📝 变量系统 - 支持在 Prompt 中使用 {{变量名}} 进行替换
  • ⚡ 链式执行 - 支持将上一步输出作为下一步的上下文
  • 💾 数据持久化 - 所有配置和工作流自动保存到浏览器本地存储
  • 📤 导入/导出 - 支持工作流配置和运行结果的导入导出
  • 🎯 实时流式输出 - 支持 OpenAI API 流式响应，实时显示生成内容
  • 📊 多种导出格式 - 支持 JSON、Markdown、CSV 格式导出运行结果
  • 🎨 Markdown 渲染 - 支持在渲染和原文之间切换
  • 📱 响应式设计 - 完美支持桌面和移动设备

快速开始

1. 直接打开

将项目文件下载到本地，直接用浏览器打开 index.html 文件即可使用。

2. 使用 Web 服务器

# 使用 Python 内置服务器
python3 -m http.server 8000

# 或使用 Node.js 的 http-server
npx http-server -p 8000

# 然后访问 http://localhost:8000

# 或直接在浏览器中打开项目目录，选择 index.html 文件

3. 配置 API

  1. 点击顶部导航栏的 ⚙️ 设置 标签
  2. 输入你的 Base URL（默认：https://api.openai.com/v1）
  3. 输入你的 API Key
  4. 点击 🔄 刷新 按钮获取可用模型列表
  5. 选择要使用的模型（如 gpt-4o-mini）
  6. 配置会自动保存到浏览器本地存储

使用说明

创建工作流

  1. 在 ✏️ 编辑 标签中，点击 ➕ 新建 按钮
  2. 输入工作流名称
  3. 工作流会自动创建并切换到新建的工作流

管理变量

  1. 在工作流的 Variables 区域，点击 ➕ 新增变量
  2. 输入变量名和值（如：name: 张三）
  3. 在 Prompt 中使用 {{name}} 引用变量
  4. 变量会在运行时自动替换

添加 Prompts

  1. 在 Prompts 区域点击 ➕ 新增 按钮
  2. 输入你的 Prompt 内容
  3. 可以使用 上移、下移 调整顺序
  4. 可以使用 删除 按钮移除不需要的 Prompt

运行工作流

  1. 点击 ▶️ 运行全部 按钮（或切换到 ▶️ 运行 标签）
  2. Prompts 会按顺序执行
  3. 如果启用了 将上一步输出作为上下文，每一步的输出会传递给下一步
  4. 实时查看运行结果和统计信息

导出结果

运行完成后，可以导出结果：

  • JSON - 包含完整的运行数据和配置
  • Markdown - 适合文档和分享
  • CSV - 适合数据分析

工作流管理

  • 导出工作流 - 将当前工作流的配置（Prompts + 变量）导出为 JSON 文件
  • 导入工作流 - 从 JSON 文件导入工作流配置
  • 重命名 - 修改工作流名称
  • 删除 - 删除当前工作流（至少保留一个）

配置说明

API 设置

参数 说明 默认值
Base URL OpenAI API 的基础 URL https://api.openai.com/v1
API Key 你的 OpenAI API 密钥 无
Model 使用的模型 gpt-4o-mini
Temperature 生成文本的随机性（0-2） 1
Max Tokens 最大生成 token 数 100000
高级参数 额外的 JSON 参数（如 {"top_p":1}） {}

运行选项

  • 将上一步输出作为上下文 - 启用后，每个 Prompt 的输出会作为下一个 Prompt 的上下文传递，形成链式对话

快捷操作

  • 📋 折叠/📖 显示 - 折叠或展开所有运行结果
  • ⛶ 全屏 - 切换全屏模式
  • 🗑️ 清屏 - 清空运行输出
  • ⏹️ 停止 - 中止当前运行
  • 📄 原文/</> 渲染 - 切换 Markdown 渲染视图
  • 📋 复制 - 复制单个输出结果

数据安全

  • ✅ 所有数据存储在浏览器本地（localStorage）
  • ✅ 不上传到任何服务器
  • ✅ API Key 仅用于直接调用 OpenAI API
  • ⚠️ 清除浏览器数据会删除所有配置和工作流

浏览器兼容性

  • ✅ Chrome/Edge (推荐)
  • ✅ Firefox
  • ✅ Safari
  • ⚠️ 需要启用 JavaScript

常见问题

Q: 如何备份我的工作流？

A: 点击 💾 导出 按钮导出当前工作流为 JSON 文件。需要恢复时，点击 📥 导入 按钮选择该文件。

Q: 支持哪些 OpenAI API 兼容服务？

A: 支持所有符合 OpenAI API 规范的服务，只需修改 Base URL 即可，如：

  • OpenAI 官方 API
  • Azure OpenAI Service
  • 其他兼容服务（如 LocalAI、FastChat 等）

Q: 为什么点击刷新模型没有反应？

A: 请确保已正确配置 Base URL 和 API Key，并检查网络连接和 API Key 权限。

Q: 如何重置所有配置？

A: 打开浏览器开发者工具（F12），在 Console 中执行：

localStorage.clear()
location.reload()

Q: 变量语法是什么？

A: 使用双花括号 {{变量名}}，例如：

变量设置：name = 张三
Prompt 中使用：你好，我是{{name}}
实际运行时：你好，我是张三

技术栈

项目结构

WebPromptWorkflow/
├── index.html      # 主应用文件（包含所有 HTML、CSS、JavaScript）
├── icon.svg        # 应用图标
└── README.md       # 项目说明文档

开发

本地开发

项目是单文件应用，直接编辑 index.html 即可。

自定义样式

所有样式都在 <style> 标签中，可根据需要修改 CSS 变量：

:root {
  --bg: #0f1117;          /* 背景色 */
  --fg: #e6edf3;          /* 前景色 */
  --accent: #5b9cff;      /* 强调色 */
  --border: #223041;      /* 边框色 */
  /* ... 更多变量 */
}

贡献

欢迎提交 Issue 和 Pull Request！

Star History Chart

许可证

MIT License

相关链接

© 2025 Prompt 工作流 · 本地运行 · 数据隐私安全