使用Amplify和Cognito自定义注册页遇必填字段错误

核心原因 #

你的注册请求传递的用户属性名格式不符合Cognito要求：报错提示的name.givenName、name.familyName是错误的属性键，Cognito标准必填属性的键为given_name和family_name（下划线格式），而非嵌套的驼峰格式。

修正方法 #

在调用Amplify的signUp方法时，需在attributes字段中直接使用Cognito的标准属性键，而非嵌套结构。以下是正确的代码示例：

import { Auth } from 'aws-amplify';

async function handleSignUp() {
  try {
    const user = await Auth.signUp({
      username: email, // 需与Cognito用户池配置的用户名字段一致（此处用email作为用户名）
      password: password,
      attributes: {
        email: email,
        given_name: firstName, // 对应Cognito的given_name必填属性
        family_name: lastName  // 对应Cognito的family_name必填属性
      }
    });
    console.log('Sign up success:', user);
  } catch (error) {
    console.error('Error signing up:', error);
  }
}

关键验证点 #

• 确认Cognito用户池的属性设置中，given_name和family_name已被标记为必填项；
• 检查前端代码，确保没有将这两个属性嵌套在name对象中传递，必须直接作为attributes的顶级键；
• 保留当前aws-exports.js配置（已验证有效）。

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