JinDaGe - cloudflare-browser-rendering-mcp MCP Details

article

README

🚀 云flare 浏览器渲染模型上下文协议（MCP）服务器

本项目利用 Cloudflare 的浏览器渲染技术，实现了网页快照生成、网络内容处理等功能，并集成了主流大语言模型，为开发者提供了便捷的网页数据处理解决方案。

🚀 快速开始

# 安装依赖
npm install cloudflare-mcp

# 启动 MCP 服务
node src/server.ts

📦 安装指南

克隆仓库
使用 npm 进行构建：
```
npm install
npm run build
```
启动测试：
```
npm test
```

🔧 配置

项目结构

| 文件路径 | 说明 | | ---- | ---- | | src/index.ts | 主程序入口 | | src/server.ts | MCP 服务器实现 | | src/browser-client.ts | 与 Cloudflare 浏览器渲染交互的客户端 | | src/content-processor.ts | 处理网络内容以适应大语言模型 | | puppeteer-worker.js | Cloudflare 工作进程实现 |

✨ 主要特性

核心功能

浏览器渲染
- 使用 Cloudflare 的浏览器渲染技术生成网页快照。
- 支持多种格式输出（图片、HTML 等）。
内容处理
- 提供多种网络内容处理工具，包括：
  - 文本提取
  - 结构化数据抽取
  - 内容摘要
模型适配
- 集成主流大语言模型（如 GPT）。
- 支持自定义模型扩展。

💻 使用示例

基础用法

配置示例

在 src/server.ts 中配置 Cloudflare 账户信息：

import { CloudflareMCP } from 'cloudflare-mcp'

const cf = new CloudflareMCP({
  email: 'your@email.com',
  apiKey: 'your_api_key',
  zoneId: 'your_zone_id'
})

获取网页快照

await cf.renderPage('https://example.com', {
  width: 1280,
  height: 800,
  format: 'png'
})

提取文本内容

const text = await cf.extractText('https://example.com')
console.log(text)

🛠️ 故障排除

常见问题

"BROWSER_RENDERING_API 环境变量未设置"
- 检查 src/server.ts 中的环境变量配置。
- 确保 Cloudflare 账户信息正确填写。
"渲染服务不可用"
- 查看 Cloudflare 控制台确认浏览器渲染功能已启用。
- 确保 API 请求频率在允许范围内。
"权限不足"
- 检查账户是否具备所需权限。
- 联系 Cloudflare 支持团队升级权限。

🛠️ 开发指南

代码贡献规范

遵循云开发规范。
提交 PR 前通过 npm test 进行单元测试。
确保文档更新同步进行。

贡献者名单

张三（负责人）
李四（开发人员）
王五（测试工程师）

📄 许可证

MIT

cloudflare-browser-rendering-mcp