跳到主要内容

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 密钥和身份验证

连接到您的服务器并获取响应

  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: 您想要发送以触发工作流的聊天输入消息。 这仅对带有 Chat 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. 随请求一起传递 tweaks 对象。 Tweaks 是对组件设置的编程运行时覆盖。

    此示例更改了工作流中语言模型组件所使用的 LLM:


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

  2. 随请求传递 会话 ID (session 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 和流式传输来运行工作流:


    _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);

    替换以下内容:

    • baseUrl: 您的 Langflow 服务器 URL。
    • flowId: 您想要运行的工作流 ID。
    • input: 您想要发送以触发工作流的聊天输入消息,假设工作流具有 Chat Input 组件。
    • tweaks: 任何要应用于工作流运行的 tweak 修改器。 此示例更改了工作流中某个组件使用的 LLM。
    • session_id: 传递一个自定义会话 ID。 如果省略或为空,工作流 ID 将作为默认会话 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 日志,您必须通过在 Langflow .env 文件中包含以下值来在 Langflow 服务器上启用日志检索:


_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
// 开始流式传输日志
_26
console.log('Starting log stream...');
_26
for await (const log of await client.logs.stream()) {
_26
console.log('Log:', log);
_26
}
_26
_26
// 运行工作流
_26
await runFlow(client);
_26
_26
}
_26
_26
main().catch(console.error);

替换以下内容:

  • baseUrl: 您的 Langflow 服务器 URL。
  • flowId: 您想要运行的工作流 ID。
  • input: 您想要发送以触发工作流的聊天输入消息,假设工作流具有 Chat Input 组件。

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

结果

为了便于阅读,以下示例结果已截断,但您可以跟随这些消息查看工作流如何实例化其组件、配置其模型以及处理输出。

在流结束时,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
}

有关更多信息,请参阅 日志端点 (Logs endpoints)

Search