FastGPT实习:AI流式响应全链路分析
需求背景在AI应用中,实现向AI模型请求提问并返回流式响应,最终呈现打字机输出效果。这种交互方式能够提升用户体验,让AI的回答更加自然流畅。 技术架构分析整体流程概览整个流式响应系统涉及6个关键环节: 前端发起SSE连接 后端接收请求并调用AI模型 AI模型流式响应给后端 后端设置SSE响应头并流式发送 前端流式接收数据 渲染组件实现打字机效果 详细技术实现1. 前端发起SSE连接前端使用Server-Sent Events技术建立与后端的持久连接,为后续的流式数据传输做准备。 2. 后端接收请求并调用AI模型后端接收前端的请求后,调用AI模型API获取响应。 3. AI模型流式响应处理核心机制:异步迭代器 AI模型返回一个异步迭代器给后端,而不是完整的响应数据。异步迭代器就像一个数据管道,让后端可以通过for await循环实时获取AI生成的数据。 数据内容包含: 元数据信息 标签数据 推理内容 回答内容 处理流程: 持续接收数据直到用户手动退出或AI模型生成完毕 数据分批次到达,需要特殊处理机制 4. 函数工厂模式实现状态管理设计原理:由于流式处理中数据分批次到达...
FastGPT实习:双Token验证实现CSRF防御
双Token验证实现CSRF防御需求分析:在 FastGPT 平台发现安全漏洞,发送markdown渲染的img标签,如果src属性为”删除api”的路径(如:/api/core/dataset/delete),则会将用户的知识库自动删除 通过实现双Token验证机制,有效防御CSRF(跨站请求伪造)攻击 保护用户数据安全,防止恶意站点利用用户身份执行敏感操作 问题分析漏洞描述发送markdown渲染的img标签,如果src属性为”删除api”的路径(如:/api/core/dataset/delete),则会将用户的知识库自动删除 问题本质由于前端请求自动携带浏览器cookie作为请求头,后端校验通过后,执行图片中的路径,造成CSRF恶意攻击 攻击原理 用户已登录平台,浏览器中存储cookie信息 恶意站点的某些表单、图片等请求指向平台的敏感接口 当用户被诱导访问后,浏览器会在请求中自动添加cookie 仅凭Cookie做鉴权的服务端误以为是用户本人操作,执行敏感动作 解决方案技术方案:双Token验证实现步骤 前端Token获取: 前端发送请求前,检测本地存储中没有c...
FastGPT实习:从渲染和请求的时序中学习React设计哲学
从渲染和请求的时序中学习React设计哲学需求分析:在 FastGPT 平台开发过程中,遇到组件渲染与异步请求时序问题 通过解决组件渲染空数组的问题,深入理解 React 的异步渲染机制和设计哲学 学习如何优雅地处理异步数据加载与组件渲染的协调 问题描述打开一个modal时, 网络请求已经获取到了数据, 但是modal没有渲染出数据 核心问题组件渲染和API请求是异步进行的,导致组件优先渲染了变量的初值(空数组) 当异步请求获取到数据,填充到数组中时,组件已经渲染完毕了 最终结果就是渲染了空数组 问题影响 用户看到空白或加载状态 数据更新后界面不会自动刷新 用户体验不佳 解决方案技术方案使用 useMemo 来缓存数组,并将请求的数据变量作为依赖项 请求成功,依赖项变化,更新数组,进而重新渲染组件 解决渲染空数组的问题 实现原理 组件初始渲染时显示空数组 异步请求开始执行 请求完成后,依赖项更新 useMemo 检测到依赖变化,重新计算 组件重新渲染,显示实际数据 方案优点性能优化不会因为某一个数组在加载中,而阻塞渲染,让整个组件树等待,提升使用体验 可以让多个数据源同...
FastGPT实习:扫描二维码实现自动兑换积分
扫描二维码实现自动兑换积分的完整流程需求分析:在 FastGPT 平台实现用户扫描二维码自动兑换积分功能 用户扫描包含兑换码信息的二维码,自动跳转到门户网站登录页,登录成功后,自动兑换兑换码,增加账号积分 实现用户无需手动输入兑换码,提升用户体验 需求分析二维码的本质二维码的本质是用二维图形存储二进制数据的信息载体 扫描一次二维码的本质是通过光学识别将图形转化为二进制数据,再解码出二维码中包含的数据,并执行 二维码需要包含的信息 重定向地址 兑换码 兑换码是否被使用 实现登录后自动兑换的方案方案A:携带查询参数到登录页扫描二维码后, 会重定向到登录页, 同时url中会携带兑换码信息作为查询参数 登录接口会接收查询参数中的兑换码信息, 并在登录成功后再传递给兑换接口 兑换接口在收到兑换码信息后执行, 即可兑换积分 方案B:使用本地存储扫码跳转登录页后,将兑换码存储在本地存储 登录后检测本地存储,符合条件则执行兑换API,并删除存储 具体实现技术选型选择方案B 原因: 登录接口有多种, 微信登录, 账密登录等等, 选择方案A的话每个接口都需要修改 修改底层登录接口这种行为, ...
FastGPT实习:HTTP插件改造为HTTP工具集
FastGPT实习:HTTP插件改造为HTTP工具集项目概述负责FastGPT开源项目中HTTP插件的重大架构升级,将原有的单一HTTP插件重构为灵活的HTTP工具集系统,提升了系统的可扩展性和用户体验。 核心工作内容架构设计与重构 将原有的单一HTTP插件(httpPlugin)重构为HTTP工具集(httpToolSet) 支持在一个工具集中管理多个HTTP工具 全栈开发 独立完成前后端完整开发 包括React前端界面、Node.js后端API、数据库模型设计 工具集管理系统 实现HTTP工具的CRUD操作 支持OpenAPI规范解析,自动生成工具配置 灵活配置能力 支持自定义请求头、认证信息、超时设置等高级配置 满足企业级API集成需求 国际化支持 完整的中英文国际化实现 提升产品国际化水平 技术亮点 类型安全开发:采用TypeScript进行类型安全开发,确保代码质量 动态表单生成:基于JSON Schema实现动态表单生成,提升用户配置体验 状态管理优化:使用React Hook + Context模式进行状态管理,优化组件性能 OpenAPI集成:实现O...
FastGPT实习:生产者-消费者模式实现企微流式响应
从企业微信流式响应中学习生产者-消费者模式需求分析:在 FastGPT 平台,将工作流的发布渠道与企业微信智能机器人对接 实现企业微信回调 FastGPT 的地址,FastGPT 将工作流处理好的 AI 回复返回给企微 实现企微智能机器人能够使用 FastGPT 平台的功能 企业微信对接文档-流式响应的架构企微会给回调 URL(即自己配置的后台程序)发送两种类型的请求 第一种是消息推送, 只会在第一次向后台程序发送请求时发送 第二种是轮询请求。即当企微接收到消息推送请求的响应后,开始发送轮询请求 具体文档可参考 企业微信智能机器人文档 实现难点 为什么企业微信要发送轮询请求?消息推送请求和轮询请求的本质区别是什么?需要为两种请求写不一样的逻辑处理吗? 等待 AI 输出全部结果,再返回给企微,耗时太长,如何优化 HTTP 请求是无状态的, 后台程序每收到一次请求, 都不知道上一次请求响应了什么数据, 从而无法实现回复内容的追加 如果每接收一次请求, 就调用一次 AI 输出回答. 由于轮询的频率很快, 一次 AI 回答还没输出完, 就要又一次调用 AI 输出. 最后会产生“轮询次...
支持向量机(SVM)初见
SVM 学习概念 SVM分为: SVC(分类任务) SVR(回归任务),股票分析主要用SVR 超平面:k-1维的最佳分类标准 支持向量:离超平面最近的点 支持向量机:找到支持向量,构建超平面 核函数:将低维空间映射到高维空间,使得数据线性可分 分析以 get_train_model 函数为例: 1234567891011121314151617181920212223242526272829303132333435def get_train_model(dataset): # 设置训练阶树 DEGREE_POLY = 1 # 进行因子筛选 selected_factors = get_ic_with_sharpe(dataset) # 进行训练集和测试集提取 X = dataset[selected_factors].values y = dataset['sharpe'].values X_train, X_test, y_train, y_test = train_test_split(...
《人月神话》读书笔记
《人月神话》读书笔记2025.4.13 - 2025.4.17,笔者拜读了软件工程领域的名作《人月神话》,在此写下读书笔记与心得。 1. 书籍介绍《人月神话》的行文以比喻见长,将软件工程中的各种问题以比喻的形式呈现 同时,本书表面上是讲软件工程,真正的内核是软件工程背后的社会学原理 遗憾的是,笔者才学疏浅,无法全部理解书中的各种概念,加之年代久远和翻译的误差,很多说法与如今有所出入 比如说系统设计与开发,在书中应该是指的是软件项目的架构的设计与实现 而在如今的语境中,指的是操作系统的设计与开发 尽管有所偏差,但笔者仍然想写下对书中经典比喻的分析 2. 内核分析 焦油坑:在大型的软件开发中,实际进度会被各种问题耽搁这些问题可以分为项目本身的代码问题和项目外的管理问题从项目本身来看,如果一个项目前期的技术选型,代码规范,开发流程等没有事前安排好那么随着项目的开发,这些问题会逐渐暴露,最终成为拖延进度的焦油坑;从项目外来看,一个开发团队的组织与管理也会影响到项目的进度,一个好的团队可以参考后面的“外科手术队伍”这个比喻。在笔者目前的认知中,最广为人知的焦油坑就是Windows操作系...
go爬虫学习
golang爬虫学习目的是学习一下爬虫的流程,顺便熟悉一下go的语法和使用 代码仓库见我的github仓库 项目介绍本项目爬取的是mundo中的组队信息,从而快速了解组队的概况,以便进一步筛选适合且人数未满的队伍 使用的工具: golang原生http库等网络请求、解析相关的库 gorm docker 开发流程1. 分析网页打开mundo组队页面,F12打开开发者工具,找到网络栏 在document类型的请求中找到名为teamup的请求,查看它的响应, 发现里面没有数据,说明这些信息是通过api请求得到的,无法在DOM中获取 再筛选xhr类型,找到 allteam?service=mundo ,正是所需要的响应 接下来通过伪造api请求,来获取它的响应,从而实现数据爬取 2. 实现请求将响应的json转换为go的结构体可以直接复制json数据,交给ai处理,也可以用爬虫工具处理得到响应结构体 12345type Response struct { Code int `json:"code"` Message ...