如何在Next.js App Router的Middleware中获取Server Action的函数名与参数

Server Action发起的POST请求，其核心信息会被Next.js封装在请求体的__NEXT_ACTION字段中，你可以通过解析这个字段来获取函数名和参数，具体实现如下：

具体代码实现 #

import { NextRequest, NextResponse } from 'next/server';

export default async function middleware(request: NextRequest) {
  // 仅处理Server Action的POST请求（可根据实际路由调整判断条件）
  if (request.method === 'POST') {
    // 克隆请求，避免原请求体被读取后无法被后续流程复用
    const clonedRequest = request.clone();
    // 解析form-data格式的请求体
    const formData = await clonedRequest.formData();
    const nextAction = formData.get('__NEXT_ACTION');
    
    if (nextAction) {
      try {
        // 解析序列化的Action信息
        const actionData = JSON.parse(nextAction.toString());
        // 开发环境下，actionData.fn会包含函数名；生产环境会被哈希化
        const functionName = actionData.fn;
        // 参数以数组形式存储
        const args = actionData.args;
        
        console.log('Server Action函数名:', functionName);
        console.log('Server Action参数:', args);
      } catch (err) {
        console.error('解析Server Action信息失败:', err);
      }
    }
  }

  return NextResponse.next();
}

关键注意事项 #

• 生产环境限制：生产环境中Next.js会对Server Action的函数名进行哈希处理，无法直接获取原始函数名。如果需要在生产环境识别特定Action，可以：
  • 调用Action时额外传递一个自定义标识参数
  • 在Action函数内部添加日志记录逻辑，而非依赖Middleware获取函数名
• 请求克隆：必须克隆请求后再解析体，否则原请求的数据流会被消耗，导致后续路由处理失败

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