从零开始:前端转型 AI Agent 直到就业——第十八天
1. 今日目标今天是前端转型 AI Agent 的第十八天。经过前十七天的学习我们已经掌握了 Python 基础、LangChain 核心概念、Agent 工作流设计等关键知识。今天的目标是打通从本地 Agent 原型到可部署服务的最后一公里完成一个能对外提供 API 服务的 Agent 应用并理解部署上线的基本流程。2. 回顾与定位在开始今天的内容之前先快速回顾一下前十七天的学习路径第 1-5 天Python 语法、虚拟环境、依赖管理完成前端思维到后端思维的初步转换第 6-10 天LangChain 基础、Prompt 工程、模型调用封装第 11-15 天Agent 核心机制ReAct、Tool Calling、记忆管理、多工具编排第 16-17 天构建了一个本地可运行的 Agent 原型具备联网搜索和简单问答能力今天我们要做的就是把第 17 天完成的本地原型改造成一个可以通过 HTTP 接口访问的服务。3. 为什么需要服务化本地脚本和线上服务之间隔着几个关键差异并发处理本地脚本一次只能服务一个请求线上服务需要同时处理多个用户请求接口标准化前端调用后端需要统一的 RESTful API 或 WebSocket 协议状态管理Agent 的多轮对话需要会话隔离不同用户不能互相干扰可观测性线上环境需要日志、监控、错误追踪而不是简单的 print作为前端开发者我们对 HTTP 协议、JSON 序列化、异步请求这些概念并不陌生这恰恰是服务化改造中最大的优势。4. 技术选型我们选择FastAPI作为 Web 框架原因如下性能优秀基于 Starlette 和 Pydantic异步原生支持上手简单对前端开发者友好装饰器风格类似 Express自动文档内置 Swagger UI调试方便类型提示与 Python 类型系统完美结合减少运行时错误安装依赖pipinstallfastapi uvicorn5. 改造本地 Agent 为 API 服务5.1 项目结构调整将原来的单文件脚本拆分为清晰的项目结构agent-service/ ├── app/ │ ├── __init__.py │ ├── main.py # FastAPI 入口 │ ├── agent.py # Agent 核心逻辑 │ ├── schemas.py # 请求/响应模型 │ └── session.py # 会话管理 ├── requirements.txt └── .env5.2 定义请求与响应模型# app/schemas.pyfrompydanticimportBaseModelfromtypingimportOptionalclassChatRequest(BaseModel):message:strsession_id:Optional[str]NoneclassChatResponse(BaseModel):reply:strsession_id:strusage:Optional[dict]None5.3 封装 Agent 调用# app/agent.pyfromlangchain.agentsimportAgentExecutorfromlangchain.memoryimportConversationBufferMemoryclassAgentService:def__init__(self):self.memory_map{}self.agentself._build_agent()def_build_agent(self):# 复用第 17 天构建的 Agent 逻辑# 这里省略具体实现保持与之前一致passdefchat(self,message:str,session_id:str)-str:ifsession_idnotinself.memory_map:self.memory_map[session_id]ConversationBufferMemory()# 调用 Agent 并返回结果returnself.agent.invoke({input:message})5.4 创建 FastAPI 入口# app/main.pyfromfastapiimportFastAPIfromapp.schemasimportChatRequest,ChatResponsefromapp.agentimportAgentServiceimportuuid appFastAPI(titleAI Agent Service)agent_serviceAgentService()app.post(/chat,response_modelChatResponse)asyncdefchat(request:ChatRequest):session_idrequest.session_idorstr(uuid.uuid4())replyagent_service.chat(request.message,session_id)returnChatResponse(replyreply,session_idsession_id)app.get(/health)asyncdefhealth():return{status:ok}5.5 启动服务uvicorn app.main:app--host0.0.0.0--port8000--reload启动后访问http://localhost:8000/docs即可看到自动生成的 API 文档可以直接在页面上测试接口。6. 前端如何对接作为前端开发者对接这个 API 非常自然// 前端调用示例asyncfunctionchatWithAgent(message,sessionId){constresponseawaitfetch(http://localhost:8000/chat,{method:POST,headers:{Content-Type:application/json},body:JSON.stringify({message,session_id:sessionId})});returnresponse.json();}这里有几个前端需要注意的点跨域问题开发环境需要配置 CORSFastAPI 中可通过CORSMiddleware解决流式输出如果需要打字机效果可以改用StreamingResponse返回 SSE 流会话管理前端负责生成或保存session_id实现多轮对话的上下文延续7. 部署上线基础本地跑通后下一步是部署到服务器。最轻量的方式是使用 DockerFROM python:3.11-slim WORKDIR /app COPY requirements.txt . RUN pip install -r requirements.txt COPY . . CMD [uvicorn, app.main:app, --host, 0.0.0.0, --port, 8000]构建并运行dockerbuild-tagent-service.dockerrun-p8000:8000 agent-service8. 今日总结第十八天我们完成了从本地脚本到 API 服务的跨越。核心收获理解了本地开发与线上服务的差异掌握了 FastAPI 的基本用法完成了 Agent 的服务化封装打通了前端调用 Agent 的完整链路明天我们将深入流式输出和 SSE 协议让 Agent 的回复像 ChatGPT 一样逐字输出进一步提升用户体验。9. 实践作业将你第 17 天的 Agent 原型改造成 FastAPI 服务用 Postman 或前端页面调用/chat接口验证多轮对话尝试在 FastAPI 中配置 CORS允许前端跨域访问思考如果同时有 100 个用户调用当前实现会有什么问题

相关新闻

为什么我不建议普通前端盲目卷全栈?

为什么我不建议普通前端盲目卷全栈?

1. 引言 这两年“全栈”这个词在技术圈里越来越热,打开招聘软件,满屏都是“全栈工程师优先”;打开技术社区,到处是“前端已死,赶紧转全栈”的论调。于是不少前端同学开始焦虑:是不是不学 Node.js、不写后端…

2026/8/18 9:03:06 阅读更多 →
[基于OpenEvals的自动化评估-16]自动模拟多轮对话实施评估

[基于OpenEvals的自动化评估-16]自动模拟多轮对话实施评估

由于大多数现代AI应用(如智能客服、Agent、RAG 系统)都是基于聊天对话的,传统的单轮单答(Single-turn)测试无法捕获用户修改意图、追问或上下文丢失等复杂情况。OpenEvals允许你用另一个AI扮演虚拟用户,与你…

2026/8/18 8:58:50 阅读更多 →
基于Spring Boot共享单车信息系统的设计与实现

基于Spring Boot共享单车信息系统的设计与实现

背景 共享单车作为城市绿色出行的重要组成部分,近年来在全球范围内快速发展,成为解决“最后一公里”出行难题的有效方案。随着城市化进程的加速和环保意识的增强,共享单车凭借其便捷性、经济性和低碳特性,迅速融入城市交通体系。然…

2026/8/18 9:31:10 阅读更多 →

最新新闻

基于大语言模型的地球观测科学假设自动生成框架EO-Agents解析

基于大语言模型的地球观测科学假设自动生成框架EO-Agents解析

1. 从数据洪流到科学洞察:EO-Agents的诞生背景如果你也像我一样,每天打开NASA的Earthdata、欧空局的哥白尼数据门户,或者任何一个主流的地球观测数据平台,第一感觉可能不是兴奋,而是“头大”。海量的卫星影像、多光谱数…

2026/8/18 9:57:42 阅读更多 →
多数据库检索中的重复数据问题与去重技术方案

多数据库检索中的重复数据问题与去重技术方案

1. 多数据库检索中的重复数据问题在科研、市场调研或商业分析工作中,我们经常需要从多个数据库检索信息。比如同时查询PubMed、Web of Science和CNKI等学术数据库,或者从不同电商平台抓取商品数据。这时最头疼的问题就是:不同来源的检索结果中…

2026/8/18 9:57:42 阅读更多 →
ARM Cortex-M查表跳转指令TBB/TBH原理与编译器优化实战

ARM Cortex-M查表跳转指令TBB/TBH原理与编译器优化实战

1. 项目缘起:一个被忽视的底层指令在嵌入式开发,尤其是基于ARM Cortex-M系列内核的项目中,我们每天都在和C语言、编译器、链接器打交道。高级语言和开发框架的便利性,常常让我们忽略了处理器最底层的执行机制。直到有一天&#xf…

2026/8/18 9:57:42 阅读更多 →
GPS、基站、WiFi与AGPS定位技术原理全解析与应用实战

GPS、基站、WiFi与AGPS定位技术原理全解析与应用实战

1. 项目概述:从“我在哪”到“它知道我在哪”的技术演进 我们每天都在使用手机地图导航、叫外卖、刷社交软件,这些服务能精准地知道我们的位置,背后是多种定位技术协同工作的结果。你可能听说过GPS、WiFi定位、基站定位,还有那个听…

2026/8/18 9:57:42 阅读更多 →
L293D电机驱动芯片引脚与参数详解:从H桥原理到工程实践

L293D电机驱动芯片引脚与参数详解:从H桥原理到工程实践

1. 从一块“老古董”芯片聊起:为什么L293D依然值得深究 最近在整理工作室的元件盒,翻出了一把L293D,就是那种经典的16脚DIP封装,黄褐色的塑料外壳,上面印着ST的Logo。说实话,现在市面上有太多性能更强、集成…

2026/8/18 9:57:42 阅读更多 →
2026年7月铜陵市新房价格深度分析报告

2026年7月铜陵市新房价格深度分析报告

一、报告摘要本报告基于2026年7月铜陵市新房实际成交案例,从成交价格、区域分布、户型结构、购房人群特征等维度进行深度分析。数据显示,2026年7月铜陵市新房成交均价为每平方米7280元,环比上涨1.2%,同比上涨3.8%。其中&#xff0…

2026/8/18 9:56:41 阅读更多 →

日新闻

告别逐帧截图:用 extract-video-ppt 快速提取视频中的 PPT 并一键导出 PDF

告别逐帧截图:用 extract-video-ppt 快速提取视频中的 PPT 并一键导出 PDF

告别逐帧截图:用 extract-video-ppt 快速提取视频中的 PPT 并一键导出 PDF 【免费下载链接】extract-video-ppt extract the ppt in the video 项目地址: https://gitcode.com/gh_mirrors/ex/extract-video-ppt 如果你还停留在"看网课 不停暂停 截图 …

2026/8/18 0:00:57 阅读更多 →
思源宋体TTF一站式上手:7个字重免费商用,从下载到上线的完整走查

思源宋体TTF一站式上手:7个字重免费商用,从下载到上线的完整走查

思源宋体TTF一站式上手:7个字重免费商用,从下载到上线的完整走查 【免费下载链接】source-han-serif-ttf Source Han Serif TTF 项目地址: https://gitcode.com/gh_mirrors/so/source-han-serif-ttf 你是不是也经历过这种时刻:设计稿里…

2026/8/18 0:00:58 阅读更多 →
华硕笔记本控制权回收指南:GHelper 如何用一个 10MB 文件替代 Armoury Crate

华硕笔记本控制权回收指南:GHelper 如何用一个 10MB 文件替代 Armoury Crate

华硕笔记本控制权回收指南:GHelper 如何用一个 10MB 文件替代 Armoury Crate 【免费下载链接】g-helper Lightweight Armoury Crate alternative for Asus laptops with nearly the same functionality. Works with ROG Zephyrus, Flow, TUF, Strix, Scar, ProArt, …

2026/8/18 0:00:59 阅读更多 →

周新闻

基于阿里云与通义千问(Qwen)构建AI应用:从模型调用到生产部署的完整实践指南

基于阿里云与通义千问(Qwen)构建AI应用:从模型调用到生产部署的完整实践指南

如果你是一名开发者,最近可能已经感受到了AI大模型正在从“玩具”变成“生产力工具”的强烈信号。从代码补全到智能Agent,从本地部署到云端API,我们正处在一个技术栈快速重构的节点。然而,面对层出不穷的模型、框架和工具&#xf…

2026/8/18 9:15:35 阅读更多 →
工业通信系统底层逻辑:04 反射——高频能量撞墙之后会发生什么?

工业通信系统底层逻辑:04 反射——高频能量撞墙之后会发生什么?

第四篇:反射——高频能量撞墙之后会发生什么? —— 你以为信号已经过去了,其实它正在回来打你 老Q的现场笔记 第五季,我们正式进入工业神经系统层。这里不再是单个设备的战斗,而是整个工厂“经脉”层面的秩序之战。从这一篇开始,你将第一次看清:看似简单的信号传播,背…

2026/8/18 9:06:28 阅读更多 →
【文章复现】非线性值迭代自适应动态规划(ADP):离散时间非线性系统的策略迭代自适应动态规划算法研究附Matlab代码

【文章复现】非线性值迭代自适应动态规划(ADP):离散时间非线性系统的策略迭代自适应动态规划算法研究附Matlab代码

✅作者简介:热爱科研的Matlab仿真开发者,擅长毕业设计辅导、数学建模、数据处理、建模仿真、程序设计、完整代码获取、论文复现及科研仿真。🍎 往期回顾关注个人主页:Matlab科研工作室👇 关注我领取海量matlab电子书和…

2026/8/18 9:04:56 阅读更多 →

月新闻

免费解锁百度网盘SVIP加速:macOS用户必备的下载提速终极指南

免费解锁百度网盘SVIP加速:macOS用户必备的下载提速终极指南

免费解锁百度网盘SVIP加速:macOS用户必备的下载提速终极指南 【免费下载链接】BaiduNetdiskPlugin-macOS For macOS.百度网盘 破解SVIP、下载速度限制~ 项目地址: https://gitcode.com/gh_mirrors/ba/BaiduNetdiskPlugin-macOS 还在为百度网盘macOS版的龟速下…

2026/8/17 18:54:37 阅读更多 →
终极ncmdump指南:3分钟实现网易云NCM音乐解密与格式转换

终极ncmdump指南:3分钟实现网易云NCM音乐解密与格式转换

终极ncmdump指南:3分钟实现网易云NCM音乐解密与格式转换 【免费下载链接】ncmdump 项目地址: https://gitcode.com/gh_mirrors/ncmd/ncmdump 还在为网易云音乐下载的NCM格式文件无法在其他播放器播放而烦恼吗?ncmdump解密工具帮你轻松解决这个困…

2026/8/17 18:55:16 阅读更多 →
HarmonyOS 应用开发《掌上英语》第81篇: 智能体卡片:为英语学习 App 打造桌面级学习助手

HarmonyOS 应用开发《掌上英语》第81篇: 智能体卡片:为英语学习 App 打造桌面级学习助手

AgentCard 智能体卡片:为英语学习 App 打造桌面级学习助手适用平台:HarmonyOS 7.0 (API 26 Beta)一、引言 HarmonyOS 7.0(API 26 Beta)新增了 AgentCard 智能体卡片能力,这是继 HMAF(鸿蒙智能体框架&#x…

2026/8/17 18:55:55 阅读更多 →