Openai MCP Mongodb News

OpenAI 应用程序 SDK MongoDB 新闻连接器

🚀 A（火箭或某种加速/推进的象征，具体含义需根据上下文确定） 已准备好投入生产的 集成MongoDB的OpenAI Apps SDK MCP服务器，用于通过（某种方式）展示新闻文章 交互式小部件 在ChatGPT中，遵循官方的披萨示例架构。

🎯 这是什么

这是一个 正确的OpenAI应用程序SDK实现 that:（这个英文单词单独出现时，通常作为指示代词或连接词，翻译为中文时根据上下文可能翻译为“那”、“那个”、“这（指代前文提到的内容）”等，但在这里没有具体上下文，所以直接保留为“that”或根据需要翻译为相应的中文指示词。）

• ✅ 用途 FastMCP （非标准IO MCP）
• ✅ 实施 可流式传输的HTTP 交通；运输
• ✅ 退货 小部件元数据 (_meta.openai/outputTemplate)
• ✅ 服务 基于React的UI组件 作为嵌入式资源
• ✅ 与……集成 MongoDB（注：MongoDB是一个开源的跨平台分布式数据库系统，常用于处理大量数据和提供高可扩展性。） 对于真实数据
• ✅ 遵循 披萨示例 来自（或“源自”）的建筑风格/建筑 openai/openai-apps-sdk-示例

🏗️ 建筑学

┌─────────────┐
│   ChatGPT   │  (OpenAI Apps SDK Client)
│  (Web/App)  │
└──────┬──────┘
       │ Streamable HTTP + SSE
       │ MCP Protocol
┌──────▼──────┐
│ MCP Server  │  (FastMCP - Python)
│   FastAPI   │  - Tools (fetch_news, search_news)
└──────┬──────┘  - Resources (widget HTML)
       │         - Metadata (_meta.openai/*)
┌──────▼──────┐
│  Widgets    │  (React Components)
│  (Browser)  │  - NewsListWidget
└─────────────┘  - NewsSearchWidget
       │
┌──────▼──────┐
│   MongoDB   │  (News Database)
└─────────────┘

📁 项目结构

openai-mcp-mongodb-news/
├── server/                    # MCP Server (Python)
│   ├── main.py               # FastMCP server with widgets
│   └── requirements.txt      # Python dependencies
│
├── web/                      # Widget Components (React)
│   ├── src/
│   │   ├── NewsListWidget.tsx    # News feed widget
│   │   ├── NewsSearchWidget.tsx  # Search results widget
│   │   └── styles.css            # Widget styles
│   ├── package.json
│   ├── vite.config.ts
│   └── tsconfig.json
│
├── assets/                   # Built widget bundles
│   ├── news-list.js
│   ├── news-list.css
│   ├── news-search.js
│   └── news-search.css
│
├── scripts/                  # Setup scripts
│   └── setup_mongodb.py
│
└── docker-compose.yml        # Full stack deployment

🚀 快速入门

先决条件

• Python 3.10及以上版本
• Node.js 18及以上版本
• MongoDB 4.4及以上版本
• pnpm（推荐）或 npm

1. 克隆仓库

git clone https://github.com/vikkysarswat/openai-mcp-mongodb-news.git
cd openai-mcp-mongodb-news

2. 设置MongoDB

# Option A: Local MongoDB
# Make sure MongoDB is running on localhost:27017

# Option B: Docker
docker-compose up -d mongodb

# Initialize with sample data
cd scripts
python -m venv .venv
source .venv/bin/activate
pip install pymongo python-dotenv
python setup_mongodb.py

3. 构建小部件

cd web
pnpm install  # or npm install
pnpm run build  # Builds to ../assets/

4. 运行MCP服务器

cd ../server
python -m venv .venv
source .venv/bin/activate  # Windows: .venv\\Scripts\\activate
pip install -r requirements.txt

# Set environment variables
export MONGODB_URI=\"mongodb://localhost:27017/\"
export MONGODB_DATABASE=\"news_db\"
export MONGODB_COLLECTION=\"news\"
export ASSET_BASE_URL=\"http://localhost:4444\"

# Start server
python main.py

服务器将在 http://localhost:8000

5. 提供小部件资源

# In another terminal
cd web
pnpm run serve  # Serves assets on http://localhost:4444

6. 使用ngrok进行暴露（用于ChatGPT）

# In another terminal
ngrok http 8000

你会得到一个类似这样的URL： https://abc123.ngrok-free.app

7. 连接到ChatGPT

1. 启用 开发者模式 在ChatGPT设置中
2. 首选 设置 > 连接器
3. 点击 添加连接器
4. 输入您的ngrok URL： https://abc123.ngrok-free.app/mcp
5. 连接器将自动发现工具

🔧 配置

环境变量

# MongoDB
MONGODB_URI=mongodb://localhost:27017/
MONGODB_DATABASE=news_db
MONGODB_COLLECTION=news

# Assets (where widgets are hosted)
ASSET_BASE_URL=http://localhost:4444

# For production
ASSET_BASE_URL=https://your-cdn.com

小部件资源托管

对于 生产在CDN上托管小部件资源：

• 上传 assets/* 到您的内容分发网络（CDN）
• 更新 ASSET_BASE_URL 在服务器上
• 小部件从CDN URL加载

🛠️ 工具

1. 获取新闻

使用过滤器获取新闻文章。

# ChatGPT usage
\"Show me technology news from the last 3 days\"

# Tool parameters
{
  \"category\": \"Technology\",  # Optional
  \"limit\": 10,              # Default: 10
  \"days_back\": 3            # Default: 7
}

返回值： 带有交互式小部件的新闻文章

2. 搜索新闻

按关键词搜索新闻。

# ChatGPT usage
\"Search for articles about artificial intelligence\"

# Tool parameters
{
  \"query\": \"artificial intelligence\",
  \"limit\": 10  # Default: 10
}

返回： 搜索结果中高亮显示匹配项

3. 获取新闻类别

列出可用的类别。

# ChatGPT usage
\"What news categories are available?\"

返回值： 带数量的类别列表

🎨 小部件

新闻列表小部件

以卡片布局显示新闻文章，包含：

• 文章标题、分类徽章、内容预览
• 来源及出版日期
• “阅读更多”链接到原文文章
• 刷新按钮以重新加载
• 类别筛选器（即将推出）

新闻搜索小部件

显示包含以下内容的搜索结果：

• 新查询的搜索输入
• 突出显示匹配的文本
• 与NewsListWidget相同的卡片布局
• 搜索查询显示

小部件功能

这两个小部件都使用 window.openai API

• \window.openai.data\ 翻译成中文是：“窗口（或全局对象）中的 OpenAI 数据” - 接收结构化数据
• \window.openai.callTool()\ 翻译成中文是：“调用OpenAI工具” - 调用MCP工具
• \window.openai.sendFollowupMessage()\ 翻译成中文是：“窗口（或API）中的OpenAI发送后续消息”。不过，这里的“window”可能指的是浏览器环境中的全局对象，而“openai”可能是一个特定于OpenAI API的实例或对象，因此更自然的表达可能是：“通过OpenAI API发送后续消息”。但直接按照原句结构翻译，就是上述结果 - 发送消息
• \window.openai.requestDisplayMode()\ 翻译成中文是：“请求OpenAI的显示模式”。不过，这个表述可能需要根据具体的上下文来调整，因为“displayMode”可能指的是某种特定的显示设置或界面模式，具体含义可能因OpenAI的API或应用而异。在更通用的语境下，可以理解为“请求OpenAI调整显示模式”或“请求OpenAI展示特定模式” - 更改布局

📊 MongoDB 模式（或架构）

{
  \"_id\": ObjectId,
  \"title\": String,           // Required
  \"content\": String,         // Required
  \"category\": String,        // Required
  \"source\": String,          // Required
  \"published_date\": Date,    // Required
  \"url\": String,             // Optional
  \"author\": String,          // Optional
  \"image_url\": String        // Optional
}

🐳 Docker 部署

# Full stack with Docker Compose
docker-compose up -d

# Server: http://localhost:8000/mcp
# Assets: http://localhost:4444
# MongoDB: localhost:27017

🧪 测试

1. 使用MCP Inspector进行测试

# Install MCPJam or MCP Inspector
npm install -g @modelcontextprotocol/inspector

# Connect to your server
mcp-inspector http://localhost:8000/mcp

2. 在本地测试小部件

cd web
pnpm run dev  # Opens Vite dev server

3. 在ChatGPT中测试

启用开发者模式并添加连接器

📚 与标准MCP的主要区别

🔗 资源

• OpenAI 应用程序 SDK 示例
• 应用程序SDK文档
• MCP规范
• FastMCP 文档

🤝 贡献

这遵循了OpenAI的应用程序软件开发工具包（Apps SDK）架构。在贡献时：

1. 保持服务器逻辑在（系统/程序中） server/main.py
2. 保持小部件用户界面在（屏幕上/可见） web/src/
3. 在测试之前构建小部件
4. 遵循 React + TypeScript 的最佳实践
5. 使用 window.openai 小部件服务器通信的API

📄 许可证

麻省理工学院许可证 - 请参阅LICENSE文件

👤 作者

尼莱什·维基

• GitHub： @维姬·萨尔瓦特
• 电子邮箱：vikky.sarswat@gmail.com

______________________________________________________________________

⭐ 给这个仓库点赞/收藏 如果你觉得它有帮助！

🐛 蝴蝶（或昆虫） 报告问题：

💬（表示说话或文字交流的表情符号） 讨论: