如何在Vercel AI SDK的API中获取传递的slug参数

你遇到的问题核心是参数传递位置不匹配：前端将slug放在了URL的查询参数中，但后端却尝试从POST请求的请求体（req.json()）里读取这个参数，所以无法获取到。

解决方案一：后端从URL查询参数读取slug #

直接解析请求URL的查询参数来获取slug，修改后端代码如下：

export async function POST(req: Request) {
  try {
    const { userId } = auth();
    // 解析URL中的查询参数
    const url = new URL(req.url);
    const slug = url.searchParams.get('slug');
    
    if (!slug) {
      return new Response(JSON.stringify({ error: 'slug参数缺失' }), { status: 400 });
    }
    
    const body = await req.json();
    const { messages } = body;
    
    // 后续业务逻辑...
  } catch (error) {
    // 错误处理逻辑
    return new Response(JSON.stringify({ error: '服务器错误' }), { status: 500 });
  }
}

解决方案二：前端将slug放入请求体（推荐） #

更符合POST请求的参数传递规范，将slug加入请求体中，修改前端代码：

const { messages, input, handleInputChange, handleSubmit, isLoading, error } =
  useChat({
    api: '/api/conversation',
    // 自定义请求体，合并slug与默认参数
    prepareBody: (messages) => ({
      messages,
      slug: params.slug,
    }),
  });

此时后端原有代码无需修改，即可正常从请求体中获取slug：

export async function POST(req: Request) {
  try {
    const { userId } = auth();
    const body = await req.json();
    const { messages, slug } = body;
    
    // 后续业务逻辑...
  } catch (error) {
    // 错误处理逻辑
    return new Response(JSON.stringify({ error: '服务器错误' }), { status: 500 });
  }
}

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