Nuxt AI 应用开发 · 高级项目面

Nuxt AI 应用如何缓存模型响应，又如何避免缓存错误和隐私泄露？

考察 AI 缓存的 key 设计、新鲜度、个性化和一致性。

适合阶段：高级 / 资深前端 · AI 应用面 / 架构面核心能力：Nuxt · Nitro · AI 工程化 · 生产治理

面试官想考什么

• 能否先定义 AI 场景和 Nuxt 的边界？
  考察 AI 缓存的 key 设计、新鲜度、个性化和一致性。
• 能否讲清端到端链路？
  重点考察：canonical request -> policy/permission fingerprint -> cache lookup -> provider call -> normalized result -> TTL/tag invalidation；流式结果可缓存最终消息或片段。
• 能否说出工程取舍？
  重点考察：缓存降低延迟和成本但会返回过期或不适用答案；语义相似缓存更省钱，却更难证明等价和权限安全。
• 能否处理线上风险？
  重点考察：记录 cache hit/miss 和版本，敏感内容默认禁用共享缓存，知识库或 Prompt 变更触发 tag purge，缓存值不含未授权 citation 和秘密。

一句话回答

AI 响应缓存只适合输入、Prompt、模型、工具版本和权限上下文都可复现的场景；缓存 key 必须包含安全边界，个性化对话通常不应使用公共缓存。

面试回答详解

这道题的核心不是“会不会调用模型”，而是能否把 Nuxt 的页面和 Nitro 服务端能力放进 AI 应用的完整闭环：输入、上下文、模型或工具、流式结果、持久化、权限、观测和失败恢复。

1. 问题边界

考察 AI 缓存的 key 设计、新鲜度、个性化和一致性。 缓存降低延迟和成本但会返回过期或不适用答案；语义相似缓存更省钱，却更难证明等价和权限安全。

2. 核心链路

canonical request -> policy/permission fingerprint -> cache lookup -> provider call -> normalized result -> TTL/tag invalidation；流式结果可缓存最终消息或片段。

用户交互 -> Nuxt 客户端状态 -> Nitro/BFF -> AI 编排
        -> 模型/RAG/工具 -> 结构化或流式结果
        -> 持久化、观测、评估和恢复

3. Nuxt 项目落地

记录 cache hit/miss 和版本，敏感内容默认禁用共享缓存，知识库或 Prompt 变更触发 tag purge，缓存值不含未授权 citation 和秘密。

• 服务端边界：模型密钥、provider 选择、权限、工具执行和成本控制放在服务端；客户端只拿到最小必要结果。
• 状态边界：区分页面状态、会话状态、run 状态和持久化数据，避免刷新、重连或多标签页时串话。
• 协议边界：流式事件、结构化输出和错误响应要有版本化契约，不能让组件猜测 provider 的原始格式。
• 安全边界：用户输入、RAG 文档、工具结果和模型输出都可能不可信，必须做权限、校验、脱敏和审计。

4. 工程取舍

缓存降低延迟和成本但会返回过期或不适用答案；语义相似缓存更省钱，却更难证明等价和权限安全。

成熟答案要明确哪些工作适合同步请求，哪些必须进入队列或工作流；哪些数据可以缓存，哪些属于用户私有数据；哪些失败可以重试，哪些副作用只能人工恢复。

5. 生产风险与验证

记录 cache hit/miss 和版本，敏感内容默认禁用共享缓存，知识库或 Prompt 变更触发 tag purge，缓存值不含未授权 citation 和秘密。 方案上线前至少覆盖正常、超时、限流、断流、取消、重复请求、权限变化、provider 故障和版本回滚。用 trace、指标、评估集、组件测试和 E2E 验证，不把“本地能显示回答”当作完成。

可直接背诵的 30 秒回答

我会先把 AI 功能拆成输入、上下文、模型或工具、结果传输、持久化和观测几层。AI 响应缓存只适合输入、Prompt、模型、工具版本和权限上下文都可复现的场景；缓存 key 必须包含安全边界，个性化对话通常不应使用公共缓存。 在 Nuxt 中，页面负责交互和状态展示，Nitro 负责鉴权、模型代理、流式协议和服务端数据访问，长任务进入可恢复的任务系统。最后我会补齐权限、成本、失败恢复、评估和灰度回滚，确保它不只是一个 Demo。

扩展知识

AI 应用通用链路

Auth -> Input Validation -> Context/RAG -> Model/Tool
     -> Stream/Structured Output -> Persistence -> Trace/Evaluation

Nuxt 中常见的职责分配

• 页面与 composable：输入、消息列表、连接状态、重试、取消和可访问反馈。
• Nitro server/api：认证、限流、模型代理、流式协议、数据访问和错误归一化。
• 后台任务：文档索引、批量生成、长 Agent、转码和重试。
• 外部系统：模型 provider、向量库、对象存储、队列、数据库和观测平台。

常见误区

• 把 AI SDK 或模型 SDK 直接导入 Vue 页面，泄露密钥和业务边界。
• 只实现 token 流，不处理断开、取消、重复、乱序和最终一致性。
• 把 RAG 文档、工具结果和用户记忆当成可信指令。
• 只看回答是否“看起来不错”，没有 Prompt/模型/检索/工具版本和评估集。

面试官追问链

追问一：Prompt 改了为什么必须失效缓存？

• 考察点：确认候选人是否能把 AI 功能落到可靠的 Nuxt 生产链路。
• 回答方向：结合状态、权限、失败恢复、成本、可观测性和部署边界回答，不要只罗列 SDK API。

追问二：语义缓存如何评估误命中？

• 考察点：确认候选人是否能把 AI 功能落到可靠的 Nuxt 生产链路。
• 回答方向：结合状态、权限、失败恢复、成本、可观测性和部署边界回答，不要只罗列 SDK API。

追问三：缓存与配额计量如何协调？

• 考察点：确认候选人是否能把 AI 功能落到可靠的 Nuxt 生产链路。
• 回答方向：结合状态、权限、失败恢复、成本、可观测性和部署边界回答，不要只罗列 SDK API。

推荐阅读

• ../advanced/15-nuxt-中如何设计请求级缓存共享缓存和进程内缓存的边界-interview
• ../performance/04-nuxt-如何通过-routerulesnitro-cache-和-cdn-优化内容型网站-interview
• Nitro 官方文档