前端大模型入门(二):掌握langchain的核心Runnable接口

简介: Langchain.js 是 Langchain 框架的 JavaScript 版本,专为前端和后端 JavaScript 环境设计。最新 v0.3 版本引入了强大的 Runnable 接口,支持灵活的执行方式和异步操作,方便与不同模型和逻辑集成。本文将详细介绍 Runnable 接口,并通过实现自定义 Runnable 来帮助前端人员快速上手。

Langchain.js 是 Langchain 框架的 JavaScript 版本,专为前端和后端 JavaScript 环境设计。在最新的 v0.3 版本中,引入了一个强大的接口——Runnable。该接口提供了一个灵活的执行方式,可以与不同类型的模型和逻辑无缝集成。

本文将重点讲解 Runnable 接口,并通过实现一个自定义的 Runnable 来帮助前端人员快速上手。

上一篇文章介绍了如何 利用langchain快速开发llm应用,后续文章将基于此逐步展开 - 不仅是开发应用,而是一起深入学习、开发高质量的应用

一. 什么是 Runnable?
Runnable 是 Langchain.js v0.3 中的一个核心接口,它代表了一个可以被执行的操作。通过这个接口,开发人员可以将模型、处理逻辑或其他任务封装为可执行对象,方便统一管理和使用。

Runnable 的基本特性包括:

输入与输出类型:可以灵活设置输入和输出的数据格式。
链式调用:Runnable 可以被连接起来,形成执行链。
异步支持:它支持异步操作,方便与 API 或模型交互。
简而言之,Runnable 是一个抽象概念,可以帮助我们在复杂的前端应用中更好地组织代码逻辑。

二. Runnable 接口的基本用法
Langchain.js 中的 Runnable 提供了一个基础接口,允许我们定义任何类型的执行逻辑。它的核心方法是 invoke,该方法接收输入数据并返回执行结果。

interface Runnable { invoke(input: any): Promise; }
通过实现这个接口,我们可以将各种自定义逻辑封装到一个 Runnable 中。

举例:自定义 Runnable
假设我们有一个简单的需求:将用户输入的文本进行大写转换,并输出转换后的结果。我们可以通过实现一个自定义的 Runnable 来完成这一任务。

import { Runnable } from 'langchain';
class UppercaseRunnable implements Runnable {
async invoke(input: string): Promise { // 将输入的字符串转换为大写 return
input.toUpperCase();
}
}
在这个例子中,我们创建了一个 UppercaseRunnable 类,它实现了 Runnable 接口,并在 invoke 方法中将输入的字符串转换为大写。

三. 将自定义模型与 Runnable 集成
除了处理简单的字符串操作,我们还可以通过 Runnable 接口将第三方模型或 API 集成到我们的前端应用中。接下来,我们来实现一个稍复杂的例子:通过 Runnable 封装一个自定义的文本分类模型。

实现自定义模型的 Runnable
假设我们有一个文本分类模型,它通过某个 API 进行分类任务。我们可以将这个模型封装到一个 Runnable 中,便于在前端应用中使用。

import { Runnable } from "langchain";
class TextClassificationRunnable implements Runnable {
private apiUrl: string;
constructor(apiUrl: string) {
this.apiUrl = apiUrl;
}
async invoke(input: string): Promise {
const response = await fetch(this.apiUrl, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ text: input }),
});
const data = await response.json();
return data.category;
}
}
在这个示例中,TextClassificationRunnable 类将文本发送到指定的 API 进行分类,并返回分类结果。通过这种方式,我们可以很方便地将模型 API 封装在前端应用中。

使用自定义的 Runnable
现在我们已经实现了两个不同的 Runnable,我们可以将它们结合起来,构建一个简单的执行链。在这个链中,我们将首先将用户输入的文本转换为大写,然后进行文本分类。

async function main() {
const uppercaseRunnable = new UppercaseRunnable();
const textClassificationRunnable = new TextClassificationRunnable(
"https://api.com/v1"
);
const input = "hello world"; // 首先将文本转换为大写
const uppercasedInput = await uppercaseRunnable.invoke(input); // 然后将大写文本发送到分类模型
const category = await textClassificationRunnable.invoke(uppercasedInput);
console.log(分类结果: ${category});
}
main();
在这个例子中,我们展示了如何通过 Runnable 接口组合不同的操作,使得代码逻辑更加清晰且可复用。

四 小结
通过 Runnable 接口,Langchain.js v0.3 为前端开发人员提供了一种简洁而强大的方式来封装和管理复杂的逻辑。无论是简单的文本处理任务,还是与第三方模型的集成,Runnable 都能提供足够的灵活性。

对于前端开发人员而言,学习和掌握 Langchain.js 的 Runnable 接口,不仅可以提升开发效率,还可以帮助我们更好地构建现代化的 AI 驱动应用。

相关实践学习
阿里云百炼xAnalyticDB PostgreSQL构建AIGC应用
通过该实验体验在阿里云百炼中构建企业专属知识库构建及应用全流程。同时体验使用ADB-PG向量检索引擎提供专属安全存储,保障企业数据隐私安全。
AnalyticDB PostgreSQL 企业智能数据中台:一站式管理数据服务资产
企业在数据仓库之上可构建丰富的数据服务用以支持数据应用及业务场景;ADB PG推出全新企业智能数据平台,用以帮助用户一站式的管理企业数据服务资产,包括创建, 管理,探索, 监控等; 助力企业在现有平台之上快速构建起数据服务资产体系
目录
打赏
0
1
1
0
58
分享
相关文章
智能体(AI Agent)开发实战之【LangChain】(二)结合大模型基于RAG实现本地知识库问答
智能体(AI Agent)开发实战之【LangChain】(二)结合大模型基于RAG实现本地知识库问答
智能体(AI Agent)开发实战之【LangChain】(一)接入大模型输出结果
LangChain 是一个开源框架,专为构建与大语言模型(LLMs)相关的应用设计。通过集成多个 API、数据源和工具,助力开发者高效构建智能应用。本文介绍了 LangChain 的环境准备(如安装 LangChain、OpenAI 及国内 DeepSeek 等库)、代码实现(以国内开源大模型 Qwen 为例,展示接入及输出结果的全流程),以及核心参数配置说明。LangChain 的灵活性和强大功能使其成为开发对话式智能应用的理想选择。
通过Milvus和Langchain快速构建基于百炼大模型的LLM问答系统
阿里云向量检索服务Milvus版是一款全托管向量检索引擎,并确保与开源Milvus的完全兼容性,支持无缝迁移。它在开源版本的基础上增强了可扩展性,能提供大规模AI向量数据的相似性检索服务。凭借其开箱即用的特性、灵活的扩展能力和全链路监控告警,Milvus云服务成为多样化AI应用场景的理想选择,包括多模态搜索、检索增强生成(RAG)、搜索推荐、内容风险识别等。您还可以利用开源的Attu工具进行可视化操作,进一步促进应用的快速开发和部署。
大模型应用开发入门分享
本文是作者给兄弟团队做的大模型入门分享,介绍了基本大模型模式,分享出来希望帮助更多的同学参与到LLM应用建设。
大模型应用开发入门分享
前端架构思考 :专注于多框架的并存可能并不是唯一的方向 — 探讨大模型时代前端的分层式微前端架构
随着前端技术的发展,微前端架构成为应对复杂大型应用的流行方案,允许多个团队使用不同技术栈并将其模块化集成。然而,这种设计在高交互性需求的应用中存在局限,如音视频处理、AI集成等。本文探讨了传统微前端架构的不足,并提出了一种新的分层式微前端架构,通过展示层与业务层的分离及基于功能的横向拆分,以更好地适应现代前端需求。
215 0
本地玩转 DeepSeek 和 Qwen 最新开源版本(入门+进阶)
本地玩转 DeepSeek 和 Qwen 最新开源版本(入门+进阶)
450 0
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
198 5
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
196 10
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等