轻松构建 AI 智能助手，我用 MCP 搞定了！附实战代码

原创于 2025-07-24 20:11:25 发布 · 620 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#人工智能 #word #开源 #架构 #langchain

最近我们聊了不少关于 MCP 服务器的应用，今天我想带大家从零开始打造一个属于自己的智能聊天机器人，我给它取名叫 Ava，用的是几个常见的框架。

这只是个初步想法，但随着时间推移，我们可以不断完善，打造一个生产级别的应用！

想象一下，你正在赶一个工作项目，但突然想起得在周六晚上7点订一家 Sushi Haven 的餐厅。你在聊天窗口输入：“这周六在 Sushi Haven 订个双人位。”

几秒钟后，你的 AI 助手 Ava 不仅帮你订好了位子，还通过 Google Calendar 确认了你那天没其他安排。

这怎么做到的？全靠 Model Context Protocol (MCP)，一个能让 Ava 连接到现实世界服务（如 OpenTable 和 Google Calendar）的工具箱。

在这篇指南里，我会教你用 Streamlit 搭建一个简洁的聊天界面，用 FastAPI 实现顺畅的通信，再加上 MCP 解锁强大的工具整合功能。

不需要高深的编程知识，我会用简单的例子和现成的代码让你轻松上手。
准备好了吗？开始吧！

这个 AI 助手到底是啥？

想象你有个私人助理叫 Ava，她可不是那种只会说“呃，我不知道，去 Google 搜吧”的普通聊天机器人。
她就像那个总比你快一步的朋友，在你开口前就帮你查好了航班信息。

Ava 厉害在哪儿？

她能听懂你的问题（得益于像 Claude 这样的 AI）。
她能通过 MCP 服务器的工具干实事，比如查邮件、点咖啡。
她有个超好用的 Streamlit 聊天界面，操作简单。
她通过 FastAPI 这个高效的信使，让一切运行得顺畅无比。

MCP 是秘密武器！
它就像 AI 的万能遥控器，能让 Ava 连接到各种工具，比如 Gmail、OpenTable，甚至你的智能家居设备。
没有 MCP，Ava 只是个会聊天的机器人；有了 MCP，她能帮你搞定实事儿。

它咋工作的？

假设你在德里计划一个浪漫的约会夜，你打开 Streamlit 应用（界面像 WhatsApp 一样简洁），输入：
“给我找个周五晚上8点的双人浪漫餐厅，还要确认我那天有没有空。”

幕后发生了啥？

你输入请求：Streamlit 抓取你的消息，通过 FastAPI（像个邮差）送出去。
FastAPI 联系 Ava：FastAPI 把请求交给 AI（这里是 Claude），AI 分析后说：“好，我得查下日历和餐厅。”
Ava 调用 MCP 服务器：MCP 大显身手，它有这些工具：
- • Google Calendar 工具：查你的日程。
- • OpenTable 工具：找餐厅并订位。
  Ava 问 MCP：“用户周五8点有空吗？”“帮我在旧金山找个浪漫餐厅。”
MCP 干重活：Calendar 工具确认你有空，OpenTable 工具找到一家超有情调的意大利餐厅 The Stinking Rose（全是蒜味菜，超香！），并订好双人位。
Ava 组织回复：Ava 从 MCP 拿到信息，说：“你周五8点有空，我在旧金山的 The Stinking Rose 订了双人位，氛围超棒，玩得开心！”
FastAPI 送回结果：回复通过 FastAPI 传回 Streamlit。
你看到答案：聊天窗口显示 Ava 的消息，约会夜搞定！

这可不是普通的聊天，Ava 能帮你做事！MCP 让 Ava 连接到现实世界的工具，简直是游戏规则的改变者。

Ava 的“脑子”咋运转的？

下面是一个流程图，展示你的问题如何从键盘到 Ava 的回答，途经整个系统。
你会看到 Streamlit（聊天窗口）、FastAPI（信使）、Claude（AI 大脑）和 MCP（工具箱）如何合作。
MCP 连接到像 OpenTable 或 Google Calendar 这样的工具，这让 Ava 超级强大。

为啥 MCP 是真正的 MVP？

为啥 MCP 这么牛？
想象家里有一堆智能设备：恒温器、电视、咖啡机，每台设备都有自己的 App 或遥控器，烦不烦？
MCP 就像一个超级 App，能控制所有设备。它是个协议，让 AI 轻松连接到各种工具，不用每次都重新开发。

MCP 牛在哪儿？

万能连接器：能对接一堆工具，从 Google Drive 到 GitHub，甚至你的智能冰箱（参考 MCP GitHub）。
简单集成：开发者可以轻松添加新工具，不用重写整个 AI 系统。
现实能力：让 AI 能干实事，比如发邮件、查银行余额。

比如，Anthropic 的 MCP 支持这些工具：

Google Workspace：查邮件、更新表格、安排会议。
GitHub：创建 pull request 或检查代码仓库。
自定义工具：你可以自己开发，比如控制 Philips Hue往往会跳转到另一个页面，但这里我们保持在同一页面。智能灯。

这意味着 Ava 可以是你的邮件助手、代码小帮手，甚至智能家居管家，全在一个应用里。

动手干吧！（一步步指南）

好了，咱们来撸代码，打造这个智能助手！
别担心，哪怕你是编程新手，我也会让过程简单得像做你最爱的 tacos。
我们会用 Streamlit、FastAPI 和 MCP 搭建 Ava，还会给你完整的代码。

你需要一台装了 Python 的电脑和一个代码编辑器（比如 VS Code）。

步骤 1：准备“厨房”（安装工具）

先收集“食材”——安装需要的 Python 包：

FastAPI：后端服务器。
Uvicorn：运行 FastAPI。
Streamlit：聊天界面。
Requests：让 Streamlit 和 FastAPI 通信。
Anthropic：调用 Claude AI 模型。
python-dotenv：管理 API 密钥等敏感信息。

打开命令行（Mac 用 Terminal，Windows 用 Command Prompt），运行：

pip install fastapi uvicorn streamlit requests anthropic python-dotenv

你还需要一个 Anthropic API 密钥来用 Claude。
去 Anthropic 官网注册，拿到密钥，保存到项目文件夹下的 .env 文件：

ANTHROPIC_API_KEY=你的密钥

这就像备好食材，准备开干！

步骤 2：用 FastAPI 搞定后端

FastAPI 后端就像 Ava 准备答案的厨房，连接 MCP 服务器，处理你的问题。
下面是简化的 FastAPI 代码，带注释解释每部分：

from fastapi import FastAPI
from pydantic import BaseModel
from typing import Dict, Any
from contextlib import asynccontextmanager
from dotenv import load_dotenv
import os

# 加载环境变量（如 Anthropic API 密钥）
load_dotenv()

# 创建 FastAPI 应用
app = FastAPI(title="Ava’s Smart Assistant API")

# 定义查询请求的结构
class QueryRequest(BaseModel):
    query: str

# 定义工具调用的结构
class ToolCall(BaseModel):
    name: str
    args: Dict[str, Any]

# 简化的 MCP 客户端类（适合初学者）
class MCPClient:
    async def connect_to_server(self, script_path: str):
        # 模拟连接到 MCP 服务器
        print(f"Connecting to MCP server at {script_path}")
        return True
    
    async def get_mcp_tools(self):
        # 返回可用工具列表（实际中会从 MCP 服务器获取）
        return [
            {"name": "opentable", "description": "Book restaurant reservations"},
            {"name": "google_calendar", "description": "Check and manage your schedule"}
        ]
    
    async def process_query(self, query: str):
        # 模拟处理查询（实际中会调用 Claude 和 MCP 工具）
        return [
            {"role": "user", "content": query},
            {"role": "assistant", "content": f"Ava’s thinking: Let me check that for you... Done! Here’s the answer for '{query}'"}
        ]

# 存储 MCP 客户端
app.state.client = None

# 应用启动时设置服务器连接
@asynccontextmanager
async def lifespan(app: FastAPI):
    client = MCPClient()
    connected = await client.connect_to_server("path/to/your/mcp_server_script.py")
    if connected:
        app.state.client = client
    yield

app = FastAPI(title="Ava’s Smart Assistant API", lifespan=lifespan)

# 处理用户查询的端点
@app.post("/query")
async def process_query(request: QueryRequest):
    messages = await app.state.client.process_query(request.query)
    return {"messages": messages}

# 列出可用工具的端点
@app.get("/tools")
async def get_available_tools():
    tools = await app.state.client.get_mcp_tools()
    return {"tools": tools}

# 调用特定工具的端点
@app.post("/tool")
async def call_tool(tool_call: ToolCall):
    # 模拟调用工具
    return {"result": f"Called {tool_call.name} with args {tool_call.args}"}

运行方法：

把代码保存为 main.py。
把 path/to/your/mcp_server_script.py 替换为实际的 MCP 服务器脚本路径（可以在 MCP GitHub 找例子）。现在是模拟版，不用真服务器也能跑。
在命令行进入 main.py 所在文件夹，运行：
```
uvicorn main:app --host 0.0.0.0 --port 8000
```
服务器会在 http://localhost:8000 启动，访问 http://localhost:8000/docs 查看 API 端点。

代码干了啥？

设置一个服务器，能处理问题（/query）、列出 MCP 工具（/tools）、调用特定工具（/tool）。
实际环境中，它会连接 Claude 和 MCP 服务器，处理查询，用 OpenTable 或 Google Calendar 等工具。

步骤 3：用 Streamlit 打造前端

现在来做聊天前端，Streamlit 让这部分简单得像搭个网页，连 HTML 都不用学。
下面是聊天界面的代码：

import streamlit as st
import requests
import json

# FastAPI 服务器的 URL
api_url = "http://localhost:8000/query"

# 设置页面标题和图标
st.set_page_config(page_title="Ava: Your Smart Assistant", page_icon="🌟")

# 添加标题
st.title("Chat with Ava! ✨")
st.write("Ask me anything, and I’ll use my tools to help!")

# 初始化会话状态，存储聊天记录
if "messages" not in st.session_state:
    st.session_state.messages = []

# 显示聊天记录
for message in st.session_state.messages:
    with st.chat_message(message["role"]):
        st.write(message["content"])

# 创建聊天输入框
query = st.chat_input("What’s on your mind?")

if query:
    # 添加用户消息到聊天记录
    st.session_state.messages.append({"role": "user", "content": query})
    with st.chat_message("user"):
        st.write(query)
    
    # 发送问题到 FastAPI
    try:
        response = requests.post(api_url, json={"query": query}, timeout=60)
        response.raise_for_status()  # 检查错误
        messages = response.json().get("messages", [])
        
        # 添加助手的回复到聊天记录
        for msg in messages:
            if msg["role"] == "assistant":
                st.session_state.messages.append({"role": "assistant", "content": msg["content"]})
                with st.chat_message("assistant"):
                    st.write(msg["content"])
    except requests.RequestException as e:
        st.error(f"Oops, something went wrong: {e}")

运行方法：

把代码保存为 app.py。
确保 FastAPI 服务器在运行（uvicorn main:app --host 0.0.0.0 --port 8000）。
在新命令行窗口，进入 app.py 所在文件夹，运行：
```
streamlit run app.py
```
浏览器会打开 http://localhost:8501，你会看到一个聊天界面。

代码干了啥？

创建一个聊天窗口，你可以输入问题。
Streamlit 把问题发给 FastAPI，拿到回复后显示在聊天窗口。
还保留了聊天记录，方便你回看 Ava 说了啥。

步骤 4：用 MCP 给 Ava 加超能力

要让 Ava 真正强大，得连上真实的 MCP 服务器。
下面是简化的 MCP 客户端代码，集成到 FastAPI 后端，连接 MCP 服务器并使用工具：

from fastapi import FastAPI, HTTPException
from pydantic import BaseModel
from typing import Dict, Any
from contextlib import asynccontextmanager
from dotenv import load_dotenv
from anthropic import Anthropic
import os

# 加载环境变量
load_dotenv()

# 创建 FastAPI 应用
app = FastAPI(title="Ava’s Smart Assistant API")

# 定义查询请求的结构
class QueryRequest(BaseModel):
    query: str

# 定义工具调用的结构
class ToolCall(BaseModel):
    name: str
    args: Dict[str, Any]

# 简化的 MCP 客户端类
class MCPClient:
    def __init__(self):
        self.anthropic = Anthropic()
        self.tools = [
            {"name": "opentable", "description": "Book restaurant reservations"},
            {"name": "google_calendar", "description": "Check and manage your schedule"}
        ]
    
    async def connect_to_server(self, script_path: str):
        # 模拟连接到 MCP 服务器
        print(f"Connected to MCP server at {script_path}")
        return True
    
    async def get_mcp_tools(self):
        # 返回可用工具
        return self.tools
    
    async def process_query(self, query: str):
        # 模拟调用 Claude 和 MCP 工具
        messages = [{"role": "user", "content": query}]
        response = self.anthropic.messages.create(
            model="claude-3-5-sonnet-20241022",
            max_tokens=1000,
            messages=messages,
            tools=self.tools
        )
        
        # 处理回复
        final_messages = [{"role": "user", "content": query}]
        for content in response.content:
            if content.type == "text":
                final_messages.append({"role": "assistant", "content": content.text})
            elif content.type == "tool_use":
                final_messages.append({
                    "role": "assistant",
                    "content": f"[Using tool {content.name} with args {content.input}]"
                })
        
        return final_messages

# 存储 MCP 客户端
app.state.client = None

# 设置服务器连接
@asynccontextmanager
async def lifespan(app: FastAPI):
    client = MCPClient()
    connected = await client.connect_to_server("path/to/your/mcp_server_script.py")
    if connected:
        app.state.client = client
    yield

app = FastAPI(title="Ava’s Smart Assistant API", lifespan=lifespan)

# 处理用户查询的端点
@app.post("/query")
async def process_query(request: QueryRequest):
    try:
        messages = await app.state.client.process_query(request.query)
        return {"messages": messages}
    except Exception as e:
        raise HTTPException(status_code=500, detail=str(e))

# 列出可用工具的端点
@app.get("/tools")
async def get_available_tools():
    try:
        tools = await app.state.client.get_mcp_tools()
        return {"tools": tools}
    except Exception as e:
        raise HTTPException(status_code=500, detail=str(e))

工作原理：

这段代码设置一个 FastAPI 服务器，连接到 MCP 服务器（这里是模拟的）。
MCPClient 类用 Anthropic API 调用 Claude 处理查询。
模拟了 OpenTable 和 Google Calendar 工具，实际中会连接真实 MCP 服务器脚本。
/query 端点处理用户问题，/tools 列出可用工具。

如何用真实 MCP 服务器：

找或创建一个 MCP 服务器脚本（比如定义 OpenTable 或 Google Calendar 工具的 Python 文件），MCP GitHub 上有例子。
在 connect_to_server 方法中更新 script_path 为你的脚本路径。
确保 MCP 服务器在运行（比如 python your_script.py）。
客户端会自动连接服务器并列出工具。

步骤 5：测试你的助手

启动 FastAPI 服务器：

uvicorn main:app --host 0.0.0.0 --port 8000

启动 Streamlit 应用：
```
streamlit run app.py
```
打开浏览器，访问 http://localhost:8501，输入类似“在 Taj 订周五晚上8点的位子”，看 Ava 怎么回应。

如果用了真实 MCP 服务器，Ava 真的会去订餐厅或查日历！

排错：

服务器没跑起来？确保 FastAPI（8000 端口）和 Streamlit（8501 端口）都在运行。
API 密钥有问题？检查 .env 文件和 Anthropic API 密钥。
MCP 服务器报错？确认脚本路径正确，服务器在运行。

Ava 还能干啥？（真实场景）

来看几个具体场景，展示 Ava 的 MCP 超能力。这些都是 MCP 能真实集成的工具。

场景 1：安排团队会议

你的请求：“下周二上午10点安排一个 Zoom 团队会议。”
Ava 干啥：

用 Google Calendar 工具检查团队日程。
找到空闲时段，订好会议。
用 Zoom 工具创建会议链接，添加到日历邀请。
回复：“搞定！周二上午10点的团队会议已安排，Zoom 邀请已发给所有人。”

再也不用来回发邮件或手动查日历，Ava 一手包办。

场景 2：即时写代码

你的请求：“在我的 GitHub 仓库为最新更改创建 pull request。”
Ava 干啥：

用 GitHub 工具访问你的仓库。
检查最新提交，创建 pull request，分配给队友。
回复：“在‘my-cool-project’仓库创建了 pull request！已分配给 Sarah 审核。”

Ava 帮你省去翻 GitHub 界面的麻烦，加速代码工作流。

场景 3：智能家居氛围

你的请求：“把客厅灯光调暗到50%，播放我的‘Chill Vibes’ Spotify 歌单。”
Ava 干啥：

用 Philips Hue 工具调整智能灯。
用 Spotify 工具启动歌单。
回复：“灯光调暗，‘Chill Vibes’正在播放，享受氛围吧！”

Ava 一句话把你的家变成智能乐园。

如何学习大模型 AI ？

由于新岗位的生产效率，要优于被取代岗位的生产效率，所以实际上整个社会的生产效率是提升的。

但是具体到个人，只能说是：

“最先掌握AI的人，将会比较晚掌握AI的人有竞争优势”。

这句话，放在计算机、互联网、移动互联网的开局时期，都是一样的道理。

我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。

我意识到有很多经验和知识值得分享给大家，也可以通过我们的能力和经验解答大家在人工智能学习中的很多困惑，所以在工作繁忙的情况下还是坚持各种整理和分享。但苦于知识传播途径有限，很多互联网行业朋友无法获得正确的资料得到学习提升，故此将重要的AI大模型资料包括AI大模型入门学习思维导图、精品AI大模型学习书籍手册、视频教程、实战学习等录播视频免费分享出来。

在这里插入图片描述