Langflow TypeScript 客户端
Langflow TypeScript 客户端允许您的 TypeScript 应用程序以编程方式与 Langflow API 进行交互。
客户端代码仓库,请参阅 langflow-client-ts。
npm 包,请参阅 @datastax/langflow-client。
安装 Langflow TypeScript 包
要安装 Langflow typescript 客户端包,请使用以下命令之一:
- npm
- yarn
- pnpm
_10npm install @datastax/langflow-client
_10yarn add @datastax/langflow-client
_10pnpm add @datastax/langflow-client
初始化 Langflow TypeScript 客户端
-
将客户端导入到您的代码中。
_10import { LangflowClient } from "@datastax/langflow-client"; -
初始化一个
LangflowClient
对象来与您的服务器交互:_10const baseUrl = "BASE_URL";_10const apiKey = "API_KEY";_10const client = new LangflowClient({ baseUrl, apiKey });将
BASE_URL
和API_KEY
替换为您部署环境中的值。 默认的 Langflow 基础 URL 是http://localhost:7860
。 要创建 API 密钥,请参阅 API 密钥。
Langflow TypeScript 客户端快速入门
-
初始化 Langflow 客户端后,通过调用您的 Langflow 服务器来测试连接。
以下示例通过发送流程 ID 和聊天输入字符串来运行流程(
runFlow
):_15import { LangflowClient } from "@datastax/langflow-client";_15_15const baseUrl = "http://localhost:7860";_15const client = new LangflowClient({ baseUrl });_15_15async function runFlow() {_15const flowId = "aa5a238b-02c0-4f03-bc5c-cc3a83335cdf";_15const flow = client.flow(flowId);_15const input = "Is anyone there?";_15_15const response = await flow.run(input);_15console.log(response);_15}_15_15runFlow().catch(console.error);替换以下内容:
baseUrl
:您的 Langflow 服务器的 URLflowId
:您要运行的流程的 IDinput
:您要发送以触发流程的聊天输入消息
-
查看结果以确认客户端已连接到您的 Langflow 服务器。
以下示例显示了格式正确的
runFlow
请求到达 Langflow 服务器并成功启动流程后的响应:_10FlowResponse {_10sessionId: 'aa5a238b-02c0-4f03-bc5c-cc3a83335cdf',_10outputs: [ { inputs: [Object], outputs: [Array] } ]_10}在这种情况下,响应包括一个
sessionID
,它是客户端-服务器会话的唯一标识符,以及一个包含流程运行信息的outputs
数组。 -
如果您想从服务器获取完整的响应对象,请将
console.log
更改为字符串化返回的 JSON 对象:_10console.log(JSON.stringify(response, null, 2));返回的
inputs
和outputs
对象的确切结构取决于您流程的组件和配置。 -
如果您希望响应仅包含来自 Chat Output 组件的聊天消息,请将
console.log
更改为使用chatOutputText
便利函数:_10console.log(response.chatOutputText());
使用高级 TypeScript 客户端功能
TypeScript 客户端不仅可以连接到您的服务器并运行流程,还能做更多事情。
此示例在快速入门的基础上增加了与 Langflow 交互的其他功能。
-
将调整参数作为对象传递给请求。
调整参数会改变组件内的值,适用于对您流程的所有调用。
此示例调整 Open-AI 模型组件以强制使用
gpt-4o-mini
模型:_10const tweaks = { model_name: "gpt-4o-mini" }; -
在请求中传递 会话 ID 以将对话与其他流程运行分离,并能够通过在将来调用相同的会话 ID 来继续此对话:
_10const session_id = "aa5a238b-02c0-4f03-bc5c-cc3a83335cdf"; -
不要在 Flow 对象上调用
run
,而是使用相同的参数调用stream
:_10const response = await client.flow(flowId).stream(input);_10_10for await (const event of response) {_10console.log(event);_10}响应是一个对象的
ReadableStream
。 有关流式传输 Langflow 响应的更多信息,请参阅/run
端点。 -
运行修改后的 TypeScript 应用程序以使用
tweaks
和session_id
运行流程,然后流式传输响应。
将 baseUrl
和 flowId
替换为您部署环境中的值。
_22import { LangflowClient } from "@datastax/langflow-client";_22_22const baseUrl = "http://localhost:7860";_22const client = new LangflowClient({ baseUrl });_22_22async function runFlow() {_22 const flowId = "aa5a238b-02c0-4f03-bc5c-cc3a83335cdf";_22 const input = "Is anyone there?";_22 const tweaks = { model_name: "gpt-4o-mini" };_22 const session_id = "test-session";_22_22 const response = await client.flow(flowId).stream(input, {_22 session_id,_22 tweaks,_22 });_22_22 for await (const event of response) {_22 console.log(event);_22 }_22_22}_22runFlow().catch(console.error);
将 baseUrl
和 flowId
替换为您的服务器 URL 和流程 ID,就像在之前的运行中所做的那样。
结果
启用流式传输后,响应包括流程元数据和流程活动的时间戳事件。 例如:
_68{_68 event: 'add_message',_68 data: {_68 timestamp: '2025-05-23 15:52:48 UTC',_68 sender: 'User',_68 sender_name: 'User',_68 session_id: 'test-session',_68 text: 'Is anyone there?',_68 files: [],_68 error: false,_68 edit: false,_68 properties: {_68 text_color: '',_68 background_color: '',_68 edited: false,_68 source: [Object],_68 icon: '',_68 allow_markdown: false,_68 positive_feedback: null,_68 state: 'complete',_68 targets: []_68 },_68 category: 'message',_68 content_blocks: [],_68 id: '7f096715-3f2d-4d84-88d6-5e2f76bf3fbe',_68 flow_id: 'aa5a238b-02c0-4f03-bc5c-cc3a83335cdf',_68 duration: null_68 }_68}_68{_68 event: 'token',_68 data: {_68 chunk: 'Absolutely',_68 id: 'c5a99314-6b23-488b-84e2-038aa3e87fb5',_68 timestamp: '2025-05-23 15:52:48 UTC'_68 }_68}_68{_68 event: 'token',_68 data: {_68 chunk: ',',_68 id: 'c5a99314-6b23-488b-84e2-038aa3e87fb5',_68 timestamp: '2025-05-23 15:52:48 UTC'_68 }_68}_68{_68 event: 'token',_68 data: {_68 chunk: " I'm",_68 id: 'c5a99314-6b23-488b-84e2-038aa3e87fb5',_68 timestamp: '2025-05-23 15:52:48 UTC'_68 }_68}_68{_68 event: 'token',_68 data: {_68 chunk: ' here',_68 id: 'c5a99314-6b23-488b-84e2-038aa3e87fb5',_68 timestamp: '2025-05-23 15:52:48 UTC'_68 }_68}_68_68// 此响应已缩略_68_68{_68 event: 'end',_68 data: { result: { session_id: 'test-session', outputs: [Array] } }_68}
使用 TypeScript 客户端检索 Langflow 日志
要检索 Langflow 日志,您必须通过在服务器的 .env
文件中包含以下值来启用日志检索:
_10LANGFLOW_ENABLE_LOG_RETRIEVAL=true_10LANGFLOW_LOG_RETRIEVER_BUFFER_SIZE=10000_10LANGFLOW_LOG_LEVEL=DEBUG
以下示例脚本在后台开始流式传输日志,然后运行流程以便您可以监控流程运行:
_26import { LangflowClient } from "@datastax/langflow-client";_26_26const baseUrl = "http://localhost:7863";_26const flowId = "86f0bf45-0544-4e88-b0b1-8e622da7a7f0";_26_26async function runFlow(client: LangflowClient) {_26 const input = "Is anyone there?";_26 const response = await client.flow(flowId).run(input);_26 console.log('Flow response:', response);_26}_26_26async function main() {_26 const client = new LangflowClient({ baseUrl: baseUrl });_26_26 // Start streaming logs_26 console.log('Starting log stream...');_26 for await (const log of await client.logs.stream()) {_26 console.log('Log:', log);_26 }_26_26 // Run the flow_26 await runFlow(client);_26_26}_26_26main().catch(console.error);
将 baseUrl
和 flowId
替换为您的服务器 URL 和流程 ID,就像在之前的运行中所做的那样。
日志开始无限期流式传输,流程运行一次。
以下示例结果为了可读性而截断,但您可以跟踪消息来查看流程如何实例化其组件、配置其模型并处理输出。
FlowResponse
对象在流的末尾返回给客户端,流程结果在 outputs
数组中。
结果
_57Starting log stream..._57Log: Log {_57 timestamp: 2025-05-30T11:49:16.006Z,_57 message: '2025-05-30T07:49:16.006127-0400 DEBUG Instantiating ChatInput of type component\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.029Z,_57 message: '2025-05-30T07:49:16.029957-0400 DEBUG Instantiating Prompt of type component\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.049Z,_57 message: '2025-05-30T07:49:16.049520-0400 DEBUG Instantiating ChatOutput of type component\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.069Z,_57 message: '2025-05-30T07:49:16.069359-0400 DEBUG Instantiating OpenAIModel of type component\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.086Z,_57 message: "2025-05-30T07:49:16.086426-0400 DEBUG Running layer 0 with 2 tasks, ['ChatInput-xjucM', 'Prompt-I3pxU']\n"_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.101Z,_57 message: '2025-05-30T07:49:16.101766-0400 DEBUG Building Chat Input\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.113Z,_57 message: '2025-05-30T07:49:16.113343-0400 DEBUG Building Prompt\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.131Z,_57 message: '2025-05-30T07:49:16.131423-0400 DEBUG Logged vertex build: 6bd9fe9c-5eea-4f05-a96d-f6de9dc77e3c\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.143Z,_57 message: '2025-05-30T07:49:16.143295-0400 DEBUG Logged vertex build: 39c68ec9-3859-4fff-9b14-80b3271f8fbf\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.188Z,_57 message: "2025-05-30T07:49:16.188730-0400 DEBUG Running layer 1 with 1 tasks, ['OpenAIModel-RtlZm']\n"_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.201Z,_57 message: '2025-05-30T07:49:16.201946-0400 DEBUG Building OpenAI\n'_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:16.216Z,_57 message: '2025-05-30T07:49:16.216622-0400 INFO Model name: gpt-4.1-mini\n'_57}_57Flow response: FlowResponse {_57 sessionId: '86f0bf45-0544-4e88-b0b1-8e622da7a7f0',_57 outputs: [ { inputs: [Object], outputs: [Array] } ]_57}_57Log: Log {_57 timestamp: 2025-05-30T11:49:18.094Z,_57 message: `2025-05-30T07:49:18.094364-0400 DEBUG Vertex OpenAIModel-RtlZm, result: <langflow.graph.utils.UnbuiltResult object at 0x364d24dd0>, object: {'text_output': "Hey there! I'm here and ready to help you build something awesome with AI. What are you thinking about creating today?"}\n`_57}
有关更多信息,请参阅 日志端点。