用 Node.js + Vue3 打造一个家居装修 AI 智能咨询助手

装修是典型的"信息不对称"行业:风格怎么选、材料怎么挑、工艺怎么验收、预算怎么控,普通业主往往要跑十几家门店、刷上百篇笔记才能拼凑出答案。本文分享一个基于大模型的家居装修智能咨询助手的技术实现思路------用一套轻量的 Node.js 全栈方案,把"专属领域智能体"落地成一个可对话、可管理、可追溯的产品。

源码:点头像--个人简介

一、它解决了什么问题

传统装修咨询存在三个痛点:

  1. 咨询门槛高:设计师档期紧、线下门店有销售导向,业主很难获得中立、即时的专业解答。
  2. 信息碎片化:风格、材料、工艺、预算分散在不同平台,缺乏针对具体问题的连贯回答。
  3. 领域泛化:通用大模型什么都能聊,但回答装修问题时容易"跑偏",专业度和针对性不足。

这个项目用"领域限定 + 流式对话 + 会话沉淀 "三件事来应对:智能体只回答家居装修相关问题,回答逐字流式输出,所有对话可被管理员追溯复盘。

二、技术选型

层次 技术
前端 Vue3 + Element Plus + JavaScript
后端 Node.js 20 + Express
数据层 MySQL 8.0 + Prisma
校验 Zod
大模型 DeepSeek(可替换为任意兼容 OpenAI 协议的服务)
鉴权 JWT + MD5 加盐

选型原则是"够用、可读、易部署 ":Express 中间件模型简单直观,Prisma 提供类型安全的数据库访问,Zod 在请求入口做统一校验,整套系统只需配置数据库连接与大模型 API 地址、密钥即可运行。

三、核心功能设计

1. 智能体配置

智能体的"人格"由系统提示词(System Prompt)定义,包括角色定位、能力边界、回答风格。后台提供 Markdown 编辑器与分屏实时预览,运营人员无需改代码即可调整智能体的专业方向与话术。同时可配置智能体名称、问候语与启停状态。

能力边界是这里的关键设计:通过提示词明确"仅回答家居装修相关问题",超出领域的问题礼貌拒答,从源头保证回答的专业性与一致性。

2. 智能体对话

前端与智能体进行多轮实时对话,支持会话创建、上下文延续与历史记录查看。回答以打字机效果逐字呈现,避免长时间白屏等待。

3. 大模型配置

大模型作为智能体的"底座"被抽象为可配置项:接口地址、API Key、模型名称。更换模型只需改配置,不动业务代码。

4. 用户与聊天记录管理

  • 前台注册用户的分页查询、搜索筛选与详情查看;
  • 管理员可追溯全部用户与智能体的对话记录,支持分页、搜索、详情;
  • 管理员与普通用户统一登录入口,JWT 令牌鉴权。

四、几个值得说的技术点

SSE 流式响应:把"等待"变成"观看"

大模型生成一段完整回答往往需要数秒。项目使用 Express 的流式响应(text/event-stream)将模型返回的增量内容实时推送给前端,前端逐块追加渲染,形成打字机效果。

实现要点:

  • 设置 Content-Type: text/event-stream、Cache-Control: no-cache、Connection: keep-alive;
  • 关闭响应缓冲,逐条 res.write() 推送 data: 事件;
  • 前端使用 fetch + ReadableStream 读取并解析分块数据;
  • 流结束时发送终止事件并 res.end(),异常时同样要正确关闭连接,避免连接泄漏。

相比一次性返回,SSE 的优势是单向、轻量、基于 HTTP,无需 WebSocket 的握手与心跳维护,非常适合"服务端持续输出、客户端只读"的对话场景。

系统提示词:用 Prompt 做产品边界

领域智能体的效果,很大程度取决于提示词工程。项目在提示词中明确了三件事:

  1. 角色:家居装修顾问,具备风格、材料、工艺、预算方面的知识;
  2. 边界:只回答装修相关问题,其他领域礼貌引导回主题;
  3. 风格:结构化、可执行,给出建议时说明理由与注意事项。

把"产品规则"写进提示词,比在代码里堆砌关键词过滤更灵活,也更容易迭代。

敏感信息掩码

大模型 API Key 属于高敏感凭证。后台展示时统一做掩码处理(如仅保留首尾若干位),编辑时留空即表示"不修改",避免密钥在页面、日志、接口响应中明文暴露。

Zod 统一校验

所有请求参数与响应结构通过 Zod Schema 定义,在路由入口统一校验与序列化。好处是:错误信息集中、类型推导自然、边界清晰,避免"参数缺失导致下游报错"的连锁问题。

Express 中间件复用鉴权与会话

把 JWT 校验、用户身份注入、会话归属校验封装为中间件,在需要保护的路由上按需挂载。会话管理同样以中间件形式实现,业务处理函数只关心"拿到当前用户和会话,然后干活",逻辑复用度高、可读性好。

Markdown 编辑与预览

智能体提示词、回答内容都涉及 Markdown。前端实现编辑区与预览区的分屏渲染,并做滚动同步,让长文本的编辑体验接近专业编辑器。

五、部署与运行

部署链路很短:

  1. 准备 MySQL 8.0 数据库并执行 Prisma 迁移;
  2. 配置大模型 API 地址与密钥(默认对接 DeepSeek,需自行开通);
  3. 启动 Express 后端与 Vue3 前端,确认接口联通即可。

六、可复用的经验

这个项目虽然聚焦家居装修,但其中的模式具备通用性:

  • 领域智能体 = 通用大模型 + 系统提示词 + 边界约束,任何垂直行业都可以用同样方式快速构建;
  • SSE 是对话类产品的最低成本流式方案,在"只需服务端推送"的场景下优于 WebSocket;
  • 把配置外置(模型、提示词、启停状态),让非技术人员也能参与智能体调优;
  • 凭证掩码 + 统一校验 + 中间件鉴权,是任何带后台管理的小型全栈项目都该具备的基础设施。

对于想学习"AI 智能体如何与 Node.js 后端深度融合"的开发者来说,这是一个结构清晰、技术点密集、又足够贴近真实业务的练手项目。

说明:智能体的回答结果仅供参考,不保证内容的准确性与专业性;实际装修决策仍建议结合专业设计师与施工方意见。

相关推荐
一缕82年的清风39 分钟前
当成千上万个Agent涌入系统:高并发大模型网关怎么搭?
agent
幸运小圣42 分钟前
fs 模块完全指南:文件读写、移动删除与文件夹操作(新手友好)【Node.js】
node.js·编辑器·vim
张张123y6 小时前
后端第十四课:Agent 记忆系统(让 Agent 记住上下文和用户,跨会话不健忘)
java·大数据·人工智能·python·agent·记忆
大模型真好玩13 小时前
初试短视频生成:豆包将我梦中的场景画出来了~
人工智能·agent·deepseek
PingCAP14 小时前
Agent 从 Demo 到生产,到底卡在哪?
数据库·tidb·agent
后端小肥肠15 小时前
挖到公众号漫画黑马赛道:简笔画小动物讲历史,漫画工坊一键直出
人工智能·aigc·agent
杨杨杨大侠16 小时前
DeepSeek Harness:连 Agent Loop 都能替换的插件架构
java·人工智能·agent
DigitalOcean16 小时前
DigitalOcean 推理路由器升级:性能调优,无需编写规则
agent
.Bryce.17 小时前
MCP+A2A+ANP,Agent通信协议的完整知识地图
java·人工智能·后端·agent·通信协议