🚀 Next.js Server Actions进阶指南：安全传递额外参数的完整方案

// app/actions/user.js
"use server"

export async function updateUser(formData) {
  const name = formData.get('name');
  console.log(name);
  // 执行数据库操作或其他服务器端逻辑
}

"use server"
export async function updateUser(formData) {
  const name = formData.get('name');
  // 使用name执行操作
}

function greet(greeting, name) {
  return `${greeting}, ${name}!`;
}

const sayHello = greet.bind(null, 'Hello');
console.log(sayHello('Alice')); // 输出: "Hello, Alice!"

// 在组件中
const actionWithUserId = updateUser.bind(null, userId);

// app/actions/user.js
"use server"

/**
 * 更新用户信息的Server Action
 * @param {string} userId - 要更新的用户ID
 * @param {FormData} formData - 包含用户输入的表单数据
 * @returns {Promise<void>}
 */
export async function updateUser(userId, formData) {
  // 验证userId的合法性（在实际应用中应更严格）
  if (!userId || typeof userId !== 'string') {
    throw new Error('无效的用户ID');
  }
  
  const name = formData.get('name');
  
  // 在实际应用中，这里会有数据库操作
  console.log(`更新用户 ${userId} 的名称为: ${name}`);
  
  // 可以返回操作结果
  return { success: true, userId, name };
}

// 原始函数
function original(a, b, c) {
  console.log(a, b, c);
}

// 预置第一个参数
const withFirst = original.bind(null, 'first');
withFirst('second', 'third'); // 输出: first second third

// 预置多个参数
const withTwo = original.bind(null, 'first', 'second');
withTwo('third'); // 输出: first second third

// Server Action定义
"use server"
export async function complexAction(param1, param2, param3, formData) {
  // 处理逻辑
}

// 在组件中
const actionWithParams = complexAction.bind(null, value1, value2, value3);

"use server"
export async function secureAction(userId, formData) {
  // 验证userId的格式和权限
  if (!isValidUserId(userId)) {
    throw new Error('无效的用户ID');
  }
  
  if (!await hasPermission(userId, 'update_profile')) {
    throw new Error('没有操作权限');
  }
  
  // 继续处理...
}

"use server"
export async function robustAction(userId, formData) {
  try {
    // 参数验证
    if (!userId) {
      throw new Error('用户ID不能为空');
    }
    
    // 业务逻辑
    const result = await performBusinessLogic(userId, formData);
    
    return { success: true, data: result };
  } catch (error) {
    console.error('Action执行失败:', error);
    
    // 返回用户友好的错误信息
    return { 
      success: false, 
      error: error.message || '操作失败，请重试' 
    };
  }
}

fetch('/api/action', {
  method: 'POST',
  headers: {
    'X-User-Id': userId
  },
  body: formData
});

// tests/actions/user.test.js
import { updateUser } from '@/app/actions/user';

describe('updateUser', () => {
  it('应该正确处理参数', async () => {
    const mockFormData = new FormData();
    mockFormData.append('name', 'Test User');
    
    // 模拟console.log以捕获输出
    const consoleSpy = jest.spyOn(console, 'log');
    
    await updateUser('test_id', mockFormData);
    
    expect(consoleSpy).toHaveBeenCalledWith('test_id');
    expect(consoleSpy).toHaveBeenCalledWith('Test User');
  });
});

// app/actions/order.js
"use server"

export async function updateOrder(orderId, userId, formData) {
  // 验证当前用户是否有权限修改这个订单
  if (!await canUserEditOrder(userId, orderId)) {
    throw new Error('没有权限修改此订单');
  }
  
  const updates = Object.fromEntries(formData);
  return await saveOrderUpdates(orderId, updates);
}

// app/actions/content.js
"use server"

export async function publishContent(
  contentId, 
  userId, 
  publishDate, 
  formData
) {
  const contentData = Object.fromEntries(formData);
  
  return await db.content.update({
    where: { id: contentId },
    data: {
      ...contentData,
      published: true,
      publishDate: new Date(publishDate),
      lastModifiedBy: userId
    }
  });
}

// app/actions/admin.js
"use server"

export async function updateUserPermissions(
  adminId, 
  targetUserId, 
  formData
) {
  // 验证管理员权限
  if (!await isAdmin(adminId)) {
    throw new Error('需要管理员权限');
  }
  
  const permissions = formData.getAll('permissions');
  return await setUserPermissions(targetUserId, permissions);
}