使用说明
🎓 AI学习助手
一个完整的学习平台,由部署在Cloudflare Workers上的MCP(模型上下文协议)服务器和漂亮的Streamlit前端界面组成。
🌟 特性
📚 维基百科搜索
搜索多种语言的维基百科文章,并获得带有缩略图和链接的简明摘要。
🌍 文本翻译
使用Google Translate API在100多种语言之间翻译文本。
📖 字典查找
查找英语单词定义、发音(带音频)、示例、同义词和反义词。
🏗️ 建筑
┌─────────────────────────────────────┐
│ Streamlit Frontend (Python) │
│ - User Interface │
│ - Visual Components │
│ http://localhost:8501 │
└──────────────┬──────────────────────┘
│ HTTP POST
▼
┌─────────────────────────────────────┐
│ MCP Server (TypeScript) │
│ - Tool Registry │
│ - API Integrations │
│ Cloudflare Workers │
└─────────────────────────────────────┘
📂 项目结构
learning-assistant-mcp/ # Root directory
├── src/
│ ├── index.ts # Main server & routing
│ └── tools/
│ ├── wikipedia.ts # Wikipedia search tool
│ ├── translate.ts # Translation tool
│ └── dictionary.ts # Dictionary lookup tool
├── learning-assistant-ui/ # Streamlit Frontend
│ ├── app.py # Main Streamlit app
│ ├── requirements.txt # Python dependencies
│ └── .venv/ # Virtual environment (gitignored)
├── screenshots/ # UI screenshots for README
├── wrangler.toml # Cloudflare config
├── package.json # Node dependencies
├── tsconfig.json # TypeScript config
├── .gitignore # Git ignore rules
└── README.md # This file
🚀 快速开始
先决条件
- Node.js 18+(用于MCP服务器)
- Python 3.11+(用于Streamlit UI)
- npm或pnpm
- uv(Python包安装程序)
- Cloudflare帐户(用于部署)
1.MCP服务器设置
# Navigate to project root
cd learning-assistant-mcp
# Install dependencies
npm install
# Run locally
npm run dev
# Test the API
npm test
# Deploy to Cloudflare Workers
npm run deploy
2.流线型UI设置
# Navigate to UI directory (from project root)
cd learning-assistant-ui
# Create virtual environment with uv
uv venv
# Activate venv
# Windows (Git Bash):
source .venv/Scripts/activate
# Linux/Mac:
source .venv/bin/activate
# Install dependencies with uv
uv pip install -r requirements.txt
# Run Streamlit app
streamlit run app.py
应用程序将在以下时间自动打开 http://localhost:8501
🖼️ 截图
维基百科搜索界面
搜索任何语言的维基百科文章,并提供即时摘要
翻译工具
通过源语言和目标语言选择在100多种语言之间翻译文本
字典查找
获取定义、带音频的发音、示例和同义词
🔧 API使用
端点
Production: https://learning-assistant-mcp.mcp-weather.workers.dev
Local: http://localhost:8787
请求格式
{
"tool": "toolName",
"input": {
// tool-specific parameters
}
}
请求示例
维基百科搜索
curl -X POST https://learning-assistant-mcp.mcp-weather.workers.dev \
-H "Content-Type: application/json" \
-d '{
"tool": "searchWikipedia",
"input": {
"query": "Machine Learning",
"language": "en"
}
}'
翻译
curl -X POST https://learning-assistant-mcp.mcp-weather.workers.dev \
-H "Content-Type: application/json" \
-d '{
"tool": "translateText",
"input": {
"text": "Hello, world!",
"sourceLang": "en",
"targetLang": "pl"
}
}'
字典查找
curl -X POST https://learning-assistant-mcp.mcp-weather.workers.dev \
-H "Content-Type: application/json" \
-d '{
"tool": "lookupWord",
"input": {
"word": "serendipity"
}
}'
响应格式
{
"success": true,
// tool-specific response data
"timestamp": "2025-11-04T05:34:31.266Z"
}
🛠️ 使用的技术
后端(MCP服务器)
- TypeScript -类型安全代码
- Cloudflare员工 -无服务器边缘计算
- 萨德 -架构验证
- 牧马人 -Cloudflare CLI
前端(流式UI)
- 溪流 -Python web框架
- 请求: -HTTP客户端
- Python 3.11+ -运行时间
- 紫外线 -快速Python包安装程序
集成API
- 维基百科REST API -文章摘要
- 谷歌翻译API -文本翻译
- 免费词典API -单词定义
📊 演出
- ⚡ 边缘计算 -部署在Cloudflare的全球网络上
- 🚀 低延迟 -平均响应时间<200ms
- 🌍 全球可用性 -全球275+个城市
- 💰 成本效益 -免费套餐每天支持10万个请求
🧪 测试
在本地测试MCP服务器
# From project root
npm run dev
# In another terminal
npm test
使用自定义请求进行测试
# Test Wikipedia
curl -X POST http://localhost:8787 \
-H "Content-Type: application/json" \
-d '{"tool": "searchWikipedia", "input": {"query": "Python"}}'
# Test Translation
curl -X POST http://localhost:8787 \
-H "Content-Type: application/json" \
-d '{"tool": "translateText", "input": {"text": "Hello", "sourceLang": "en", "targetLang": "pl"}}'
# Test Dictionary
curl -X POST http://localhost:8787 \
-H "Content-Type: application/json" \
-d '{"tool": "lookupWord", "input": {"word": "hello"}}'
📝 添加新工具
1.创建工具文件
// src/tools/your-tool.ts
import { z } from "zod";
export const yourToolInputSchema = z.object({
param: z.string(),
});
export type YourToolInput = z.infer<typeof yourToolInputSchema>;
export const yourTool = {
name: "yourTool",
description: "What your tool does",
inputSchema: yourToolInputSchema,
async handler(input: YourToolInput) {
// Your implementation
return {
success: true,
// your response data
};
},
};
2.在中注册工具 src/index.ts
import { yourTool } from "./tools/your-tool";
const tools = {
searchWikipedia: wikipediaTool,
translateText: translateTool,
lookupWord: dictionaryTool,
yourTool: yourTool, // Add here
};
3.测试和部署
npm run dev # Test locally
npm run deploy # Deploy to production
🌐 部署
将MCP服务器部署到Cloudflare
# From project root
wrangler deploy
将Streamlit UI部署到Streamlit Cloud
- 将代码推送到GitHub
- 首选 share.streamlit.io
- 连接您的存储库
- 选择
learning-assistant-ui/app.py作为主文件 - 部署!
🔐 环境变量
MCP服务器
不需要API密钥-所有服务都使用免费的公共API。
流线型UI
更新 API_URL 在 app.py 如果部署到自定义域:
API_URL = "https://your-custom-domain.workers.dev"
🤝 贡献
欢迎投稿!请按照以下步骤操作:
- 分叉存储库
- 创建要素分支(
git checkout -b feature/AmazingFeature) - 提交您的更改(
git commit -m 'Add some AmazingFeature') - 推到分支(
git push origin feature/AmazingFeature) - 打开拉取请求
📄 许可证
此项目根据MIT许可证获得许可-请参阅 许可证 文件以获取详细信息。
🙏 致谢
- 维基百科API -文章数据
- 免费词典API -单词定义
- 谷歌翻译 -翻译服务
- Cloudflare员工 -无服务器主机
- 溪流 -前端框架
📧 联系
- GitHub: @塔克森
- 项目链接: https://github.com/takzen/learning-assistant-mcp
- 在线演示: https://learning-assistant-mcp.mcp-weather.workers.dev
由以下材料制成❤️ 使用TypeScript、Python和Cloudflare Workers
