从零构建智能客服系统：基于LangChain.js的全栈技术实践

2026年3月25日 互联网

一、系统架构设计

1.1 技术栈选型

本系统采用前后端分离架构：

  • 前端：Vue3 + TypeScript + Pinia状态管理
  • 后端：Express + Node.js（LangChain.js运行环境）
  • 存储层：文件系统（文档存储） + 内存数据库（向量索引）
  • 核心框架：LangChain.js v0.2+（支持链式调用与智能代理）

1.2 模块划分

  1. src/
  2. ├── client/          # 前端应用
  3. │   ├── components/   # 对话界面组件
  4. │   └── stores/       # 状态管理
  5. └── server/          # 后端服务
  6.     ├── config/       # 环境配置
  7.     ├── controllers/  # 路由处理
  8.     ├── models/       # 数据模型
  9.     ├── services/     # 核心服务
  10.     │   ├── agents/    # 智能代理实现
  11.     │   └── chains/    # 链式处理流程
  12.     └── utils/        # 工具函数

二、核心功能实现

2.1 文档处理模块

2.1.1 文档加载器实现

  1. // services/loaders/DocumentLoader.ts
  2. import { DirectoryLoader, TextLoader } from 'langchain/document_loaders';
  4. export class CustomDocumentLoader {
  5.   static async loadFromDirectory(path: string) {
  6.     const loader = new DirectoryLoader(path, {
  7.       '.txt': (path) => new TextLoader(path),
  8.       // 可扩展支持.pdf/.docx等格式
  9.     });
  10.     return await loader.load();
  11.   }
  12. }

2.1.2 文本分块策略

采用递归分块算法处理长文档：

  1. function recursiveChunk(text: string, maxSize = 1000, minSize = 200) {
  2.   if (text.length <= maxSize) return [text];
  4.   const mid = Math.floor(text.length / 2);
  5.   const left = recursiveChunk(text.slice(0, mid), maxSize, minSize);
  6.   const right = recursiveChunk(text.slice(mid), maxSize, minSize);
  8.   return [...left, ...right].filter(chunk => chunk.length >= minSize);
  9. }

2.2 向量存储与检索

2.2.1 内存向量存储实现

  1. // services/storage/VectorStore.ts
  2. import { InMemoryDocumentStore } from 'langchain/document_loaders/fs';
  3. import { Embeddings } from 'langchain/embeddings';
  5. export class CustomVectorStore {
  6.   private store: InMemoryDocumentStore;
  8.   constructor(private embeddings: Embeddings) {
  9.     this.store = new InMemoryDocumentStore();
  10.   }
  12.   async addDocuments(docs: Document[]) {
  13.     const vectors = await this.embeddings.embedDocuments(
  14.       docs.map(doc => doc.pageContent)
  15.     );
  16.     // 实现向量存储逻辑...
  17.   }
  18. }

2.2.2 语义搜索优化

采用混合检索策略提升精度：

  1. async similaritySearch(query: string, k = 3) {
  2.   const queryEmbedding = await this.embeddings.embedQuery(query);
  3.   // 基础向量检索
  4.   let results = this.store.similaritySearchVectorWithScore(queryEmbedding, k);
  6.   // 可选：添加关键词过滤
  7.   if (shouldUseKeywordFilter(query)) {
  8.     const keywordMatches = this.keywordSearch(query);
  9.     results = results.filter(([doc]) => 
  10.       keywordMatches.includes(doc.metadata.source)
  11.     );
  12.   }
  14.   return results;
  15. }

2.3 会话记忆管理

2.3.1 上下文窗口控制

  1. // services/memory/BufferMemory.ts
  2. import { BufferMemory } from 'langchain/memory';
  4. export class ConversationMemory extends BufferMemory {
  5.   constructor(private maxTokens = 2048) {
  6.     super({
  7.       memoryKey: 'chat_history',
  8.       inputKey: 'input',
  9.       outputKey: 'output'
  10.     });
  11.   }
  13.   async getContext() {
  14.     let history = await super.loadMemoryVariables({});
  15.     // 实现基于token数的截断逻辑
  16.     return this.truncateHistory(history.chat_history);
  17.   }
  18. }

2.3.2 对话状态持久化

  1. // 前端状态管理示例
  2. export const useConversationStore = defineStore('conversation', {
  3.   state: () => ({
  4.     history: [] as ConversationEntry[],
  5.     currentSession: null as string | null
  6.   }),
  7.   actions: {
  8.     async saveSession() {
  9.       if (this.currentSession) {
  10.         await api.saveConversation({
  11.           id: this.currentSession,
  12.           messages: this.history
  13.         });
  14.       }
  15.     }
  16.   }
  17. });

2.4 智能代理集成

2.4.1 代理工具链配置

  1. // services/agents/ToolAgent.ts
  2. import { initializeAgentExecutorWithOptions } from 'langchain/agents';
  3. import { Calculator, WebSearch } from 'langchain/tools';
  5. export async function createToolAgent(llm) {
  6.   const tools = [
  7.     new Calculator(),
  8.     new WebSearch({
  9.       apiKey: process.env.SEARCH_API_KEY,
  10.       // 可配置搜索参数
  11.     })
  12.   ];
  14.   return await initializeAgentExecutorWithOptions(tools, llm, {
  15.     agentType: 'zero-shot-react-description',
  16.     verbose: true
  17.   });
  18. }

2.4.2 代理路由策略

  1. // 路由控制器示例
  2. router.post('/agent', async (req, res) => {
  3.   const { query, context } = req.body;
  5.   try {
  6.     // 根据查询类型选择代理
  7.     const agent = isFactQuestion(query) 
  8.       ? factAgent 
  9.       : calculationAgent;
  11.     const result = await agent.call({
  12.       input: query,
  13.       chat_history: context
  14.     });
  16.     res.json({ success: true, result });
  17.   } catch (error) {
  18.     res.status(500).json({ error: error.message });
  19.   }
  20. });

三、系统优化策略

3.1 性能优化方案

  1. 向量检索加速：

    • 使用FAISS等近似最近邻库替代纯内存实现
    • 实现异步索引更新机制

  2. 缓存策略：

    1. // 查询结果缓存示例
    2. const cache = new LRUCache({ max: 1000 });
    4. async function cachedQuery(query: string) {
    5.   const cacheKey = hash(query);
    6.   if (cache.has(cacheKey)) {
    7.     return cache.get(cacheKey);
    8.   }
    10.   const result = await performQuery(query);
    11.   cache.set(cacheKey, result);
    12.   return result;
    13. }

3.2 可靠性增强措施

  1. 错误处理机制：

    • 实现重试逻辑（网络请求/模型调用）
    • 降级策略（当LLM不可用时返回缓存结果）

  2. 监控体系：

    1. // 简单监控实现
    2. class QueryMonitor {
    3.   private metrics = {
    4.     success: 0,
    5.     failure: 0,
    6.     latency: [] as number[]
    7.   };
    9.   record(success: boolean, duration: number) {
    10.     this.metrics[success ? 'success' : 'failure']++;
    11.     this.metrics.latency.push(duration);
    12.   }
    14.   getStats() {
    15.     return {
    16.       successRate: this.metrics.success / 
    17.         (this.metrics.success + this.metrics.failure),
    18.       avgLatency: this.metrics.latency.reduce((a, b) => a + b, 0) / 
    19.         this.metrics.latency.length
    20.     };
    21.   }
    22. }

四、部署与扩展建议

4.1 容器化部署方案

  1. # Dockerfile示例
  2. FROM node:18-alpine
  4. WORKDIR /app
  5. COPY package*.json ./
  6. RUN npm install --production
  8. COPY . .
  10. EXPOSE 3000
  11. CMD ["node", "dist/server/index.js"]

4.2 水平扩展架构

  1. 无状态服务设计：

    • 将向量存储迁移至Redis等外部服务
    • 实现会话标识的跨实例共享

  2. 负载均衡配置：

    1. upstream langchain_servers {
    2.   server server1:3000;
    3.   server server2:3000;
    4.   server server3:3000;
    5. }
    7. server {
    8.   location / {
    9.     proxy_pass http://langchain_servers;
    10.   }
    11. }

五、总结与展望

本方案完整实现了从文档处理到智能对话的全流程，核心创新点包括：

  1. 混合检索机制提升语义理解精度
  2. 动态代理路由适应不同查询场景
  3. 多层级缓存策略优化系统性能

未来可扩展方向：

  • 接入多模态处理能力（图片/音频理解）
  • 实现主动学习机制持续优化检索效果
  • 添加用户反馈循环改进对话质量

通过本实践，开发者可以掌握LangChain.js框架的核心应用模式，为构建更复杂的智能应用奠定基础。完整代码实现已开源至某托管仓库，包含详细注释与测试用例。

最新文章