基于 LangGraph + MCP 的智能旅行规划应用。后端使用 FastAPI、LangGraph 编排旅行规划流程,通过高德 MCP 服务获取外部数据,并用 Pydantic 校验最终行程结构。前端使用 Vue 3 + TypeScript + Vite + Ant Design Vue。
- 生成多日旅行计划
- 通过高德 MCP 获取 POI、天气、路线和 POI 详情,MCP 不可用时部分能力会尝试高德 REST API 兜底
- 用 LLM 节点整合景点、酒店、天气和用户偏好
- 用 Pydantic 校验
TripPlan - 结果页展示地图、预算、每日行程、天气、酒店和餐饮
- 支持结果页本地编辑、导出图片和 PDF
- 后端和前端启动时会覆盖写入本次运行日志,便于排查问题
cd backend
conda create -n trip-planner-next python=3.11
conda activate trip-planner-next
pip install -r requirements.txt
copy .env.example .env
python run.py后端运行配置文件是 backend/.env,可参考 backend/.env.example。常用配置项:
AMAP_API_KEYAMAP_MAPS_API_KEYLLM_API_KEYLLM_BASE_URLLLM_MODEL_IDLLM_TIMEOUTHOSTPORT
高德 MCP 服务由 amap-mcp-server 提供,当前后端会使用 stdio 模式启动,例如:
amap-mcp-server stdio
后端日志文件:
backend/runtime.log
cd frontend
npm install
npm run dev前端运行配置文件是 frontend/.env,可参考 frontend/.env.example。常用配置项:
VITE_API_BASE_URLVITE_AMAP_WEB_JS_KEYVITE_AMAP_SECURITY_JS_CODE
前端日志文件:
frontend/runtime.log
POST /api/trip/planGET /api/trip/healthGET /api/map/poiGET /api/map/weatherPOST /api/map/routeGET /api/poi/detail/{poi_id}GET /api/poi/photo
Trip-Planner-Next
│
├── frontend
│ │
│ ├── main.ts
│ │ └── 注册 Vue、Router、Ant Design Vue
│ │
│ ├── App.vue
│ │ └── 页面整体布局
│ │
│ ├── views
│ │ ├── Home.vue
│ │ │ └── 用户输入旅行需求
│ │ │
│ │ └── Result.vue
│ │ └── 展示行程、地图、预算、天气、编辑、导出
│ │
│ ├── services/api.ts
│ │ └── axios 调用后端接口
│ │
│ └── types/index.ts
│ └── 前端 TypeScript 类型
│
└── backend
│
├── run.py
│ └── 启动 FastAPI
│
├── app/api/main.py
│ └── 创建 FastAPI app,注册路由
│
├── app/api/routes
│ ├── trip.py
│ │ └── POST /api/trip/plan
│ │
│ ├── map.py
│ │ └── POI、天气、路线、静态地图
│ │
│ └── poi.py
│ └── POI 详情、景点图片
│
├── app/graph
│ ├── state.py
│ │ └── LangGraph 状态
│ │
│ ├── prompts.py
│ │ └── LLM 提示词
│ │
│ └── trip_graph.py
│ └── 旅行规划工作流
│
├── app/services
│ ├── llm.py
│ │ └── LLM 客户端
│ │
│ ├── mcp_client.py
│ │ └── 高德 MCP / REST 兜底
│ │
│ └── image_service.py
│ └── 景点图片搜索
│
├── app/models/schemas.py
│ └── Pydantic 数据结构
│
└── app/utils
├── date_utils.py
└── json_utils.py