跳到主要内容

Langflow TypeScript 客户端

Langflow TypeScript 客户端允许您的 TypeScript 应用程序以编程方式与 Langflow API 进行交互。

客户端代码仓库,请参阅 langflow-client-ts

npm 包,请参阅 @datastax/langflow-client

安装 Langflow TypeScript 包

要安装 Langflow typescript 客户端包,请使用以下命令之一:


_10
npm install @datastax/langflow-client

初始化 Langflow TypeScript 客户端

  1. 将客户端导入到您的代码中。


    _10
    import { LangflowClient } from "@datastax/langflow-client";

  2. 初始化一个 LangflowClient 对象来与您的服务器交互:


    _10
    const baseUrl = "BASE_URL";
    _10
    const apiKey = "API_KEY";
    _10
    const client = new LangflowClient({ baseUrl, apiKey });

    BASE_URLAPI_KEY 替换为您部署环境中的值。 默认的 Langflow 基础 URL 是 http://localhost:7860。 要创建 API 密钥,请参阅 API 密钥

Langflow TypeScript 客户端快速入门

  1. 初始化 Langflow 客户端后,通过调用您的 Langflow 服务器来测试连接。

    以下示例通过发送流程 ID 和聊天输入字符串来运行流程(runFlow):


    _15
    import { LangflowClient } from "@datastax/langflow-client";
    _15
    _15
    const baseUrl = "http://localhost:7860";
    _15
    const client = new LangflowClient({ baseUrl });
    _15
    _15
    async function runFlow() {
    _15
    const flowId = "aa5a238b-02c0-4f03-bc5c-cc3a83335cdf";
    _15
    const flow = client.flow(flowId);
    _15
    const input = "Is anyone there?";
    _15
    _15
    const response = await flow.run(input);
    _15
    console.log(response);
    _15
    }
    _15
    _15
    runFlow().catch(console.error);

    替换以下内容:

    • baseUrl:您的 Langflow 服务器的 URL
    • flowId:您要运行的流程的 ID
    • input:您要发送以触发流程的聊天输入消息
  2. 查看结果以确认客户端已连接到您的 Langflow 服务器。

    以下示例显示了格式正确的 runFlow 请求到达 Langflow 服务器并成功启动流程后的响应:


    _10
    FlowResponse {
    _10
    sessionId: 'aa5a238b-02c0-4f03-bc5c-cc3a83335cdf',
    _10
    outputs: [ { inputs: [Object], outputs: [Array] } ]
    _10
    }

    在这种情况下,响应包括一个 sessionID,它是客户端-服务器会话的唯一标识符,以及一个包含流程运行信息的 outputs 数组。

  3. 如果您想从服务器获取完整的响应对象,请将 console.log 更改为字符串化返回的 JSON 对象:


    _10
    console.log(JSON.stringify(response, null, 2));

    返回的 inputsoutputs 对象的确切结构取决于您流程的组件和配置。

  4. 如果您希望响应仅包含来自 Chat Output 组件的聊天消息,请将 console.log 更改为使用 chatOutputText 便利函数:


    _10
    console.log(response.chatOutputText());

使用高级 TypeScript 客户端功能

TypeScript 客户端不仅可以连接到您的服务器并运行流程,还能做更多事情。

此示例在快速入门的基础上增加了与 Langflow 交互的其他功能。

  1. 将调整参数作为对象传递给请求。

    调整参数会改变组件内的值,适用于对您流程的所有调用。

    此示例调整 Open-AI 模型组件以强制使用 gpt-4o-mini 模型:


    _10
    const tweaks = { model_name: "gpt-4o-mini" };

  2. 在请求中传递 会话 ID 以将对话与其他流程运行分离,并能够通过在将来调用相同的会话 ID 来继续此对话:


    _10
    const session_id = "aa5a238b-02c0-4f03-bc5c-cc3a83335cdf";

  3. 不要在 Flow 对象上调用 run,而是使用相同的参数调用 stream


    _10
    const response = await client.flow(flowId).stream(input);
    _10
    _10
    for await (const event of response) {
    _10
    console.log(event);
    _10
    }

    响应是一个对象的 ReadableStream。 有关流式传输 Langflow 响应的更多信息,请参阅 /run 端点

  4. 运行修改后的 TypeScript 应用程序以使用 tweakssession_id 运行流程,然后流式传输响应。

baseUrlflowId 替换为您部署环境中的值。


_22
import { LangflowClient } from "@datastax/langflow-client";
_22
_22
const baseUrl = "http://localhost:7860";
_22
const client = new LangflowClient({ baseUrl });
_22
_22
async 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
}
_22
runFlow().catch(console.error);

baseUrlflowId 替换为您的服务器 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 文件中包含以下值来启用日志检索:


_10
LANGFLOW_ENABLE_LOG_RETRIEVAL=true
_10
LANGFLOW_LOG_RETRIEVER_BUFFER_SIZE=10000
_10
LANGFLOW_LOG_LEVEL=DEBUG

以下示例脚本在后台开始流式传输日志,然后运行流程以便您可以监控流程运行:


_26
import { LangflowClient } from "@datastax/langflow-client";
_26
_26
const baseUrl = "http://localhost:7863";
_26
const flowId = "86f0bf45-0544-4e88-b0b1-8e622da7a7f0";
_26
_26
async 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
_26
async 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
_26
main().catch(console.error);

baseUrlflowId 替换为您的服务器 URL 和流程 ID,就像在之前的运行中所做的那样。

日志开始无限期流式传输,流程运行一次。

以下示例结果为了可读性而截断,但您可以跟踪消息来查看流程如何实例化其组件、配置其模型并处理输出。

FlowResponse 对象在流的末尾返回给客户端,流程结果在 outputs 数组中。

结果

_57
Starting log stream...
_57
Log: 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
}
_57
Log: 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
}
_57
Log: 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
}
_57
Log: 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
}
_57
Log: 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
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.101Z,
_57
message: '2025-05-30T07:49:16.101766-0400 DEBUG Building Chat Input\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.113Z,
_57
message: '2025-05-30T07:49:16.113343-0400 DEBUG Building Prompt\n'
_57
}
_57
Log: 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
}
_57
Log: 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
}
_57
Log: 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
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.201Z,
_57
message: '2025-05-30T07:49:16.201946-0400 DEBUG Building OpenAI\n'
_57
}
_57
Log: 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
}
_57
Flow response: FlowResponse {
_57
sessionId: '86f0bf45-0544-4e88-b0b1-8e622da7a7f0',
_57
outputs: [ { inputs: [Object], outputs: [Array] } ]
_57
}
_57
Log: 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
}

有关更多信息,请参阅 日志端点

Search