https://deepwiki.com/langflow-ai/langflow/2.2-backend-architecture

后端架构

相关源文件

本文介绍了 Langflow 后端系统的核心架构，包括主要组件、交互和请求生命周期。它侧重于服务器端应用程序结构、服务层和数据管理系统。

有关前端架构的信息，请参阅前端架构。

概述

Langflow 的后端基于 FastAPI 构建，通过异步请求处理提供强大的高性能基础。该架构遵循面向服务的设计，具有依赖关系注入、清晰的关注点分离和模块化结构。

来源：

• 来源/后端/基础/langflow/main.py194-307主要 FastAPI 应用程序设置和初始化。
• 来源/backend/base/langflow/__main__.py87-145CLI 命令结构和应用程序入口点。
• 来源/后端/基础/langflow/services/deps.py服务依赖关系和初始化。

应用程序生命周期

Langflow 的应用程序生命周期通过 FastAPI 的生命周期上下文管理器进行管理，该管理器处理服务、资源和后台任务的初始化和清理。

来源：

• 来源/后端/基础/langflow/main.py111-191Lifespan 上下文管理器定义。
• 来源/后端/基础/langflow/main.py194-307应用程序创建和配置。

服务层

服务层是 Langflow 架构的核心，通过专门的服务类提供基本功能。这些服务遵循依赖关系注入模式，允许清晰地分离关注点并轻松测试。

主要服务

来源：

• src/backend/base/langflow/services/database/service.py38-480数据库服务实现。
• src/backend/base/langflow/services/settings/base.py66-495Settings 服务实现。
• src/backend/base/langflow/services/storage/local.py8-130本地存储服务实现。

服务初始化

在应用程序启动期间，通过该函数初始化服务。服务之间的依赖关系通过依赖关系注入系统进行管理。initialize_services

来源：

• 来源/后端/基础/langflow/services/utils.pyService initialization 实用程序。
• 来源/后端/基础/langflow/main.py130-140应用程序生命周期中的服务初始化。

数据库架构

Langflow 使用 SQLModel（基于 SQLAlchemy 构建）进行数据库作，同时支持 SQLite 和 PostgreSQL 数据库。数据库层包括模型、通过 Alembic 进行的迁移管理和连接处理。

数据库模型

主要数据库模型包括：

• 流：表示具有节点和边缘的流
• User：表示系统的用户
• 文件夹：将流程组织到文件夹中
• 消息：存储聊天消息
• ApiKey：管理 API 身份验证
• 事务：记录流执行历史记录
• VertexBuild：跟踪节点构建输出

数据库连接根据应用程序设置进行配置，支持连接池、重试和各种数据库驱动程序。

来源：

• src/backend/base/langflow/services/database/service.py38-480数据库服务实现。
• src/backend/base/langflow/services/数据库/models/flow/model.py流模型定义。
• src/backend/base/langflow/services/database/models/user/model.py用户模型定义。

API 层

API 层是使用按域组织的 FastAPI 路由器实现的。每个路由器处理一组特定的相关作。

主要 API 路由

来源：

• 来源/后端/基础/langflow/main.py285-287主应用程序中包含的路由器。
• 来源/backend/base/langflow/api/v1/flows.py37-704流 API 路由器实现。
• 来源/后端/基础/langflow/api/v1/folders.py35-277文件夹 API 路由器实现。
• 来源/后端/基础/langflow/api/v1/files.py20-246文件 API 路由器实现。
• src/backend/base/langflow/api/v1/monitor.py22-176监控 API 路由器的实现。

请求处理管道

请求会经历几个处理步骤，包括用于身份验证、内容验证和错误处理的中间件。

来源：

• 来源/后端/基础/langflow/main.py202-217中间件注册。
• 来源/后端/基础/langflow/main.py218-250请求验证中间件。
• 来源/后端/基础/langflow/main.py289-301全局异常处理程序。

存储系统

Langflow 实现了一个存储抽象层来处理文件上传和下载。默认实现使用本地文件存储，但系统旨在支持其他存储后端（如 S3）。

来源：

• src/backend/base/langflow/services/storage/local.py8-130本地存储服务实现。
• 来源/后端/基础/langflow/api/v1/files.py20-246使用存储服务的文件 API 端点。

设置管理

Langflow 有一个强大的设置管理系统，可以处理来自各种来源（环境变量、文件、命令行）的配置，并具有合理的默认值。Settings 类提供了一种访问和修改应用程序配置的集中方法。

来源：

• src/backend/base/langflow/services/settings/base.py66-495Settings 类定义。
• 来源/backend/base/langflow/__main__.py87-166用于配置的 CLI 参数。

初始设置过程

当 Langflow 启动时，它会执行一系列初始化步骤来设置环境，包括数据库准备、加载入门项目和设置超级用户。

来源：

• 来源/后端/基础/langflow/main.py111-191应用程序生命周期管理。
• 来源/backend/base/langflow/initial_setup/setup.py45-749初始设置功能。

错误处理和监控

Langflow 包括一个全面的错误处理系统，该系统具有全局异常处理程序、详细日志记录和事务跟踪，用于监控流执行。

来源：

• 来源/后端/基础/langflow/main.py289-301全局异常处理程序。
• src/backend/base/langflow/api/v1/monitor.py22-176监控终端节点。
• 来源/后端/基础/langflow/架构/message.py368-454错误消息格式。

身份验证和授权

Langflow 使用 JWT 令牌实施强大的身份验证系统，并支持用户管理、API 密钥和基于角色的权限。

来源：

• 来源/后端/基础/langflow/服务/身份验证/utils.py身份验证实用程序函数。
• 来源/backend/base/langflow/api/v1/auth.py身份验证终端节点。

结论

Langflow 的后端架构建立在面向服务的设计、干净的关注点分离和异步处理的现代原则之上。FastAPI 基础提供高性能，而模块化服务层确保可维护性和可测试性。该系统设计为可扩展的，组件之间具有清晰的接口，并支持不同的存储和数据库后端。

流编辑器系统

相关源文件

流编辑器系统是 Langflow 的核心交互式组件，允许用户直观地创建、编辑和管理 LLM 驱动的应用程序。它提供了一个直观的画布，用户可以在其中添加节点、将其与边缘连接并配置其属性以构建复杂的 LLM 工作流，而无需编写代码。有关为编辑器中的节点提供支持的更广泛的组件系统的信息，请参阅组件系统。

概述 架构

流编辑器系统构建在 ReactFlow 之上，并遵循基于组件的架构，状态管理由 Zustand 存储处理。

来源：来源/前端
/src/pages/FlowPage/components/PageComponent/index.tsx
src/frontend/src/stores/flowStore.ts 来源/前端/来源/商店/flowsManagerStore.ts

核心组件

GenericNode 组件

该组件是流编辑器的主要构建块，它使用统一的界面渲染所有节点，无论其类型如何。GenericNode

来源：
src/frontend/src/CustomNodes/GenericNode/index.tsx

GenericNode 组件的主要功能：

• 动态节点标头：显示节点名称、图标和状态指示器
• 交互式输入/输出句柄：连接的输入参数和输出句柄
• 可折叠界面：可以最小化以节省空间
• 可自定义视图：支持显示/隐藏详细信息
• Node Status Indicators（节点状态指示器）：显示构建状态、验证错误等。
• 工具栏：提供对特定于节点的作的快速访问
• Tool Mode：代理工作流程中用作工具的节点的特殊模式

Node Toolbar 组件

NodeToolbarComponent 提供了一组丰富的作，用于作流中的节点。

来源：
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx

工具栏提供以下主要功能：

• 代码编辑：打开可自定义节点的代码编辑器
• 控件：通过模态界面配置节点参数
• 冻结：保留节点状态并防止在流程执行期间进行更新
• Tool Mode：在兼容节点的标准模式和工具模式之间切换
• 组件管理：保存、复制、共享、下载组件
• 文档：Access 组件文档
• 视觉调整：最小化/扩展节点以管理画布空间
• 编辑作：复制、粘贴和删除节点

流编辑器页面

Flow Editor Page （流编辑器页面） 是管理 ReactFlow 画布和所有交互处理的主要容器组件。

来源：来源/前端
/src/pages/FlowPage/components/PageComponent/index.tsx

流编辑器页面提供：

• 组件拖放：通过从侧边栏拖动将组件添加到画布
• 连接管理：创建和验证组件之间的连接
• 选择处理：多选、分组和作多个节点
• 画布控件：缩放、平移和导航画布
• 键盘快捷键：撤消/重做、复制/粘贴、删除和其他作
• 流程构建：验证和准备要执行的流程

状态管理

流编辑器系统使用 Zustand 存储进行状态管理，其中两个主要存储处理流编辑的不同方面。

流存储

该 管理当前流的状态，包括节点、边缘和构建状态。flowStore

来源：
src/frontend/src/stores/flowStore.ts

Flows Manager 商店

它管理多个流、撤消/重做功能的历史记录和流元数据。flowsManagerStore

来源：来源/前端/来源/商店/flowsManagerStore.ts

数据模型

流编辑器系统使用多个关键数据模型来表示流元素。

节点和边缘类型

来源：来源/前端/来源/类型/流/index.ts 来源/前端/src/types/api/index.ts

关键数据结构：

• FlowType：表示包含元数据和内容的完整流

{
  name: string;
  id: string;
  data: ReactFlowJsonObject<AllNodeType, EdgeType> | null;
  description: string;
  endpoint_name?: string | null;
  is_component?: boolean;
  // ...additional metadata
}

• NodeDataType：表示节点内的数据

{
  showNode?: boolean;
  type: string;
  node: APIClassType;
  id: string;
  output_types?: string[];
  buildStatus?: BuildStatus;
}

• EdgeType：表示节点之间的连接

{
  id: string;
  source: string;
  target: string;
  sourceHandle: string; // JSON stringified sourceHandleType
  targetHandle: string; // JSON stringified targetHandleType
  data: EdgeDataType;
}

• APIClassType：表示组件的 API 规范

{
  base_classes?: Array<string>;
  description: string;
  template: APITemplateType; // Map of input parameters
  display_name: string;
  outputs?: Array<OutputFieldType>;
  // ...additional properties
}

用户交互流

将组件添加到 Canvas

来源：来源/前端
/src/pages/FlowPage/components/PageComponent/index.tsx

连接节点

来源：
src/frontend/src/stores/flowStore.ts 来源/前端
/src/utils/reactflowUtils.ts

构建和运行流

来源：
src/frontend/src/stores/flowStore.ts 来源/前端/src/utils/buildUtils.ts

节点配置和自定义

Flow Editor 提供了多种配置和自定义节点的方法：

工具栏作

Node Toolbar 提供对常见节点作的直接访问：

来源：
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx

代码编辑器模态

代码编辑器模态允许编辑自定义组件的 Python 代码：

来源：
src/frontend/src/modals/codeAreaModal/index.tsx

输入参数

每个节点可以有多个不同类型的输入参数：

来源：来源/前端/src/types/api/index.ts

流程管理

Flow Editor System 提供了全面的流程管理功能：

保存和加载流

来源：
src/frontend/src/stores/flowStore.ts 来源/前端/来源/商店/flowsManagerStore.ts

导出和导入流

来源：
src/frontend/src/modals/exportModal/index.tsx

撤消/重做功能

来源：来源/前端/来源/商店/flowsManagerStore.ts

结论

Flow Editor System 是 Langflow 可视化开发体验的核心。它提供了一个丰富、直观的界面，用于通过拖放交互、可视化连接和可配置节点的组合来创建和作流。该系统由强大的架构提供支持，该架构将 ReactFlow 的画布功能与自定义组件和状态管理相结合，以创建无缝的开发体验。

本文档涵盖了构成 Flow Editor 系统的核心组件、数据模型、状态管理、用户交互和自定义选项。有关可在流程中使用的组件的更多信息，请参阅 Component System 页面。

来源：
src/frontend/src/CustomNodes/GenericNode/index.tsx
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx 来源/前端
/src/pages/FlowPage/components/PageComponent/index.tsx
src/frontend/src/stores/flowStore.ts 来源/前端/来源/商店/flowsManagerStore.ts 来源/前端/来源/类型/流/index.ts 来源/前端/src/types/api/index.ts 来源/前端
/src/utils/reactflowUtils.ts 来源/前端/src/utils/buildUtils.ts

节点和边

相关源文件

本页介绍了 Langflow 可视化编程接口的核心构建块：节点和边。节点表示可以通过边缘连接以创建 AI 工作流的组件（如 LLM、链、工具等）。本文档解释了节点和边在 Langflow 系统中是如何构建和渲染的，以及它们如何相互交互。

有关如何管理和保存流的信息，请参阅流管理。

节点和 Edge 概述

在 Langflow 中，流由由边（表示数据流）连接的节点（表示组件或功能）组成。可视化界面建立在 React Flow 之上，React Flow 为图形编辑器提供了基本功能。

资料来源： [
src/frontend/src/CustomNodes/GenericNode/index.tsx]， [
src/frontend/src/types/flow/index.ts]， [
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx]

节点类型和结构

Langflow 有两种主要节点类型：GenericNode（用于组件）和 NoteNode（用于注释）。

节点数据类型

节点的核心数据结构定义为 TypeScript 类型：

资料来源：[
src/frontend/src/types/flow/index.ts：37-70]， [
src/frontend/src/types/api/index.ts：31-66]

GenericNode 组件

它是主要节点类型，代表 Langflow 中可用的不同组件（LLM、链、代理等）。它是一个复杂的组件，它呈现：GenericNode

1. 节点标头（图标、标题）
2. 状态指示灯
3. 描述 （展开时）
4. 输入参数
5. 输出手柄

组件根据其状态（展开/最小化、选中、使用工具模式等）以不同的方式显示

资料来源：[
src/frontend/src/CustomNodes/GenericNode/index.tsx：66-592]

边和连接

边表示节点之间的数据流，将一个节点的输出连接到另一个节点的输入。

边缘结构

Langflow 中的每个边缘都有：

• 唯一 ID
• 源节点 ID 和句柄
• 目标节点 ID 和句柄
• 包含连接元数据的数据对象

资料来源：[
src/frontend/src/types/flow/index.ts：85-131]， [
src/frontend/src/utils/reactflowUtils.ts：104-166]

连接验证

连接节点时，Langflow 会验证：

1. 源和目标是不同的节点
2. 源的输出类型与目标的输入类型兼容
3. 对于非列表输入，输入尚未建立连接

资料来源： [
src/frontend/src/utils/reactflowUtils.ts：316-363]

节点渲染

该组件根据节点的状态和元数据动态呈现。GenericNode

视觉状态

节点具有多种视觉状态：

• 扩展/最小化 （ 属性）showNode
• 已选中（单击时）
• 构建（在流程执行期间）
• 错误（验证失败时）
• 冻结（显式设置时）
• 工具模式（特殊执行模式）

节点的外观会根据这些状态而变化，以提供视觉反馈。

输入参数渲染

输入参数根据节点的模板呈现，该模板指定每个参数的类型、要求和 UI。

资料来源：[
src/frontend/src/CustomNodes/GenericNode/index.tsx：447-458]， [
src/frontend/src/CustomNodes/GenericNode/components/RenderInputParameters.tsx]

输出参数

输出参数表示节点可以发送到其他节点的数据。它们将呈现为节点右侧的连接手柄。

每个输出都有：

• 名字
• 显示名称
• 类型 （它可以提供的数据类型）
• 可选的可见性控制（可以隐藏）

资料来源：[
src/frontend/src/CustomNodes/GenericNode/index.tsx：539-582]、[
src/frontend/src/CustomNodes/GenericNode/components/NodeOutputParameter.tsx]

节点工具栏

选择节点后，将显示 NodeToolbar，提供作来作该节点。

资料来源： [
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx：44-770]

代码编辑

对于具有代码字段的节点（如自定义函数），工具栏提供对代码编辑器的访问：

来源：[
src/frontend/src/modals/codeAreaModal/index.tsx：34-289]， [
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx：446-456]

工具模式

工具模式是某些节点的一项特殊功能，可更改它们在流程中的处理方式：

资料来源：[
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx：485-532]

节点状态和验证

节点具有指示其在流中的当前状态的构建状态：

资料来源：[
src/frontend/src/CustomNodes/GenericNode/components/NodeStatus/index.tsx]， [
src/frontend/src/style/applies.css：116-138]

节点验证

在执行流之前，会验证节点以确保它们具有所有必需的输入：

资料来源：[
src/frontend/src/utils/reactflowUtils.ts：518-601]

Edge 交互和渲染

Edge 可视化节点之间的连接并支持各种交互：

资料来源： [
src/frontend/src/utils/reactflowUtils.ts：74-166]， [
src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx：428-449]

边缘清洁

当节点更改时，将 “清理” 边缘以删除无效连接：

资料来源：[
src/frontend/src/utils/reactflowUtils.ts：74-162]

特殊节点功能

冻结节点

节点可以被 “冻结” ，这在视觉上表明它们在流程执行期间不会被重新计算：

资料来源：[
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx：468-484]， [
src/frontend/src/style/applies.css：116-138]

节点最小化

可以最小化节点以节省复杂流程中的空间：

资料来源：[
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx：190-208]

结论

Langflow 中的节点和边缘系统为构建 AI 工作流提供了灵活的可视化编程界面。节点表示具有特定功能的组件，而 edges 表示这些组件之间的数据流。该系统包括全面的验证、状态指示器和交互功能，可帮助用户有效地创建和调试其流程。

通过 ReactFlow 基础，Langflow 提供了高度交互的体验，用户可以通过连接兼容的组件并配置其参数来直观地构建复杂的工作流程。