Expedia MCP Server

配备OpenAI Apps SDK的Expedia MCP服务器

基于TypeScript的模型上下文协议（MCP）服务器，使用OpenAI Apps SDK将Expedia旅游服务与ChatGPT集成在一起。该服务器为酒店和航班搜索提供交互式UI小部件，并提供全面的过滤选项。

特性

• 2 Expedia旅行工具 具有丰富的UI小部件：

- ✈️ 航班搜索 -使用航空公司、停靠站、客舱等级和定价过滤器搜索航班 - 🏨 酒店搜索 -查找全球提供设施、星级和可用性的酒店

• 漂亮的交互式小部件 -在ChatGPT中内联呈现的自定义HTML/CSS/JS组件

• 真正的API集成 -使用RapidAPI获取实时酒店和航班数据（带模拟数据回退）

• Cloudflare员工就绪 -以零配置扩展进行全局部署

• TypeScript -完全打字，以获得更好的开发体验

项目结构

expedia-mcp-server/
├── src/
│   ├── server.ts          # Node.js MCP server (for local development)
│   └── worker.ts          # Cloudflare Workers deployment
├── ui-components/
│   ├── expedia-hotels.html   # Hotel search results widget
│   └── expedia-flights.html  # Flight search results widget
├── package.json
├── tsconfig.json
├── wrangler.toml          # Cloudflare Workers config
└── README.md

先决条件

• Node.js 18+
• npm或pnpm
• Cloudflare帐户（用于部署）
• Wrangler CLI（用于Cloudflare部署）

安装

# Navigate to the project
cd expedia-mcp-server

# Install dependencies
npm install
# or
pnpm install

# Set up your API key (optional - uses mock data without key)
cp .env.example .env
# Edit .env and add your RAPIDAPI_KEY

API设置（可选）

服务器在没有使用模拟数据的API密钥的情况下工作。对于真实数据：

1. 注册地址： 拉皮达皮
2. 订阅：

- Booking.com API 对于酒店 - 天刮器API 对于航班

1. 将API密钥复制到 .env:

   RAPIDAPI_KEY=your_key_here

看 API_SETUP_GUIDE.md 详细说明。

本地开发

运行Node.js MCP服务器

npm run dev

服务器将于启动 http://localhost:8000 使用这些端点：

• SSE流: GET http://localhost:8000/mcp
• 留言发布: POST http://localhost:8000/mcp/messages?sessionId=...

使用ngrok进行测试

要在本地使用ChatGPT进行测试，请使用ngrok公开您的服务器：

# Install ngrok if you haven't
brew install ngrok  # macOS

# Expose your local server
ngrok http 8000

您将获得一个公共URL，如下所示 https://xyz789.ngrok-free.app。在ChatGPT中使用此功能：

• 转到ChatGPT设置→ 连接器
• 添加连接器： https://xyz789.ngrok-free.app/mcp

部署到Cloudflare Workers

步骤1：安装牧马人

npm install -g wrangler

步骤2：登录Cloudflare

wrangler login

步骤3：更新wrangler.toml

编辑 wrangler.toml 并更新：

name = "expedia-mcp-server"

[vars]
BASE_URL = "https://expedia-mcp.YOUR-SUBDOMAIN.workers.dev"

步骤4：部署

npm run deploy
# or
wrangler deploy

部署后，Wrangler将提供您的worker URL：

https://expedia-mcp-server.YOUR-SUBDOMAIN.workers.dev

步骤5：添加到ChatGPT

1. 打开ChatGPT→ 设置→ 连接器
2. 点击“添加连接器”
3. 输入您的Cloudflare Worker URL /mcp/rpc 端点：

   https://expedia-mcp-server.YOUR-SUBDOMAIN.workers.dev/mcp/rpc

1. 保存并测试！

在ChatGPT中使用

连接后，您可以使用自然语言搜索酒店和航班：

酒店搜索示例：

• “查找6月15日至6月22日在巴黎的酒店”
• “给我看看东京有游泳池和健身房的四星级酒店，可供2位客人入住”
• “搜索纽约每晚200美元以下含早餐的酒店”
• “在旧金山找到有停车场的宠物友好酒店”

航班搜索示例：

• “查找12月20日从洛杉矶国际机场到肯尼迪国际机场的航班”
• 搜索3月5日出发、3月15日返回的从纽约到伦敦的往返航班
• “让我看一下从旧金山到西雅图的直达航班的商务舱”
• “查找2名乘客从芝加哥飞往迈阿密的最便宜航班”

助手将自动调用适当的工具并呈现交互式小部件。

定制

当前API集成

服务器现在使用RapidAPI进行真实的酒店和航班搜索：

设置RAPIDA_KEY后：

• 来自Booking.com的实时酒店可用性和价格
• 来自Sky Scrapper API的实时航班搜索
• 实际评级、评论和可用性

没有RAPIDI_KEY：

• 自动回退到模拟数据
• 非常适合测试和开发
• 无API成本

自定义API集成

要使用不同的API：

1. 注册 Expedia Rapid API 或使用 RapidAPI Expedia端点

1. 更新中的工具处理程序 src/worker.ts （适用于Cloudflare）或 src/server.ts （适用于节点）：

case WIDGETS.hotels.id: {
  const parsed = hotelSearchInputParser.parse(args);
  
  // Replace mock data with actual API call
  const response = await fetch('https://expedia-api.endpoint/hotels/search', {
    method: 'POST',
    headers: { 
      'Authorization': `Bearer ${env.EXPEDIA_API_KEY}`,
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      destination: parsed.destination,
      checkIn: parsed.checkIn,
      checkOut: parsed.checkOut,
      // ... other parameters
    })
  });
  
  const hotels = await response.json();
  
  return {
    content: [{ type: "text", text: `Found ${hotels.length} hotels` }],
    structuredContent: { hotels, destination: parsed.destination },
    _meta: widgetMeta(WIDGETS.hotels),
  };
}

1. 将API密钥添加到Cloudflare Workers机密：

wrangler secret put EXPEDIA_API_KEY

自定义UI小部件

在中编辑HTML文件 ui-components/ 要自定义外观，请执行以下操作：

• expedia-hotels.html -酒店搜索结果显示
• expedia-flights.html -航班搜索结果显示

小部件通过以下方式接收数据 window.__WIDGET_PROPS__ 并且可以使用内联CSS进行样式设置。

建筑

运作原理

1. ChatGPT 向MCP服务器发送用户查询
2. MCP 服务器 通过模型上下文协议公开工具
3. 工具处理程序 处理请求并返回：

- 纯文本响应 - 结构化数据（JSON） - 小部件元数据(_meta.openai/outputTemplate)

1. ChatGPT 使用HTML模板内联呈现小部件
2. 小部件 水合物与工具响应的结构化数据

MCP协议流

ChatGPT → GET /mcp (SSE connection)
       ← tools/list (available tools)
       ← resources/list (widget templates)
       
ChatGPT → tools/call (invoke tool)
       ← content + structuredContent + _meta
       
ChatGPT → resources/read (fetch widget HTML)
       ← HTML template
       
ChatGPT renders widget with data

工具架构

搜索酒店

输入参数：

• destination （必填）-目的地城市或地点
• checkIn （必填）-入住日期（YYYY-MM-DD格式）
• checkOut （必填）-退房日期（YYYY-MM-DD格式）
• guests -客人数量（默认值：2）
• rooms -房间数量（默认值：1）
• minPrice -每晚最低价格
• maxPrice -每晚最高价格
• starRating -最低星级（1-5）
• amenities -一系列理想的设施（wifi、游泳池、停车场、健身房、早餐、宠物友好、水疗）

输出小部件： 显示名称、价格、评级、设施和位置的酒店卡

探照灯

输入参数：

• origin （必填）-始发机场代码或城市
• destination （必填）-目的地机场代码或城市
• departureDate （必填）-出发日期（YYYY-MM-DD格式）
• returnDate -往返返回日期
• passengers -乘客数量（默认值：1）
• cabinClass -客舱级别（经济舱、高级经济舱、商务舱、头等舱）
• stops -站数过滤器（不间断、1站、2+站、任意）
• airlines -首选航空公司列表
• maxPrice -每位乘客的最高价格

输出小部件： 显示航空公司、时间、持续时间、停靠站和价格的航班卡

故障排除

服务器无法启动

# Check if port 8000 is available
lsof -i :8000

# Use a different port
PORT=8001 npm run dev

无法在ChatGPT中呈现的小部件

1. 检查连接器URL是否正确
2. 验证CORS标头是否已设置（已配置）
3. 检查浏览器控制台是否有错误
4. 确保 _meta.openai/outputTemplate 与资源URI匹配

Cloudflare部署失败

# Check your Cloudflare account
wrangler whoami

# Test locally first
wrangler dev

演出

• Cloudflare员工：~50ms冷启动，~10ms热启动请求
• 全球CDN：部署到全球200多个城市
• 无数据库：无状态设计，可实现最大的可扩展性

安全

• 无需授权：此示例不使用身份验证（仅模拟数据）
• CORS已启用：允许ChatGPT从任何来源连接
• 输入验证：使用Zod模式验证所有输入
• 沙盒小部件：HTML小部件在独立的iframe中运行

许可证

麻省理工学院许可证-欢迎将其用作您自己的MCP服务器的模板！

资源

• OpenAI应用SDK示例
• 模型上下文协议规范
• Cloudflare员工文档
• Expedia API文档

贡献

欢迎投稿！请随时提交拉取请求。

______________________________________________________________________

由ZeroTwo提供技术支持

此MCP服务器是 ZeroTwo人工智能平台 --一个统一的工作空间，为您提供GPT-5、Claude、Gemini、图像生成、人工智能搜索和旅行就绪集成，如Expedia连接器——所有这些都在一个订阅中。

专为ZeroTwo打造 --将此Expedia MCP服务器与 ZeroTwo的人工智能助手 使用自然语言搜索航班和酒店，并在线呈现精美的交互式结果。

内置于❤️ 使用TypeScript、MCP和OpenAI Apps SDK