Vercel AI库onFinish函数在AI响应完成后未执行问题求助

可能原因及对应解决方案 #

1. API响应格式不符合库的预期 #

ai/react的useCompletion依赖流式响应（比如通过OpenAIStream处理后的响应）来触发onFinish回调。如果后端API没有返回正确格式的流式响应，会导致库无法识别响应结束，从而不触发onFinish。

• 检查NextJS API路由代码，确保使用库提供的工具处理响应：

  // 示例API路由代码
  import { OpenAIStream, StreamingTextResponse } from 'ai';
  import OpenAI from 'openai';
  
  const openai = new OpenAI({ apiKey: process.env.OPENAI_API_KEY });
  
  export async function POST(req: Request) {
    const { prompt } = await req.json();
    const response = await openai.completions.create({
      model: 'gpt-3.5-turbo-instruct',
      stream: true,
      prompt,
    });
    const stream = OpenAIStream(response);
    return new StreamingTextResponse(stream);
  }
  

• 确认后端返回的是StreamingTextResponse而非普通的JSON响应。

2. 响应未正常结束或存在异常 #

如果API请求的流式响应中途中断、不完整，或者后端抛出未捕获的异常，onFinish不会被触发：

• 打开浏览器开发者工具的Network面板，找到对应的/api/chat/${companion.id}请求，查看响应是否完整，有没有报错状态码（如5xx、4xx）。
• 检查后端API代码，确保没有未捕获的错误，流被正确关闭。比如在处理OpenAI响应时，确保stream: true参数已设置，且没有在中途终止响应。

3. 库版本存在bug #

不同版本的ai包可能存在回调触发逻辑的问题：

• 执行npm list ai或yarn list ai查看当前版本，尝试升级到最新稳定版：

  npm install ai@latest
  # 或
  yarn add ai@latest
  

• 升级后重新测试，确认onFinish是否正常触发。

4. 确认onFinish参数传递是否正常 #

可以在onResponse中打印响应内容，验证后端是否返回了完整的文本：

onResponse: (response) => {
  console.log("C2", response);
  // 如果是流式响应，可以查看是否有完整的文本内容
},

如果响应内容不完整，说明后端没有正确返回全部数据，需要排查后端逻辑。

内容的提问来源于stack exchange，提问作者Zain Ali