faceio登录成功后如何在reactjs中验证cognito用户

Question

我正在使用

faceio 通过面部识别登录我的 ReactJS 应用程序。

对于同一个 React 应用程序，我使用 aws cognito 使用用户名和密码登录。

当我尝试使用faceio登录react应用程序时，我正在调用多个cognito api来获取用户详细信息和其他表单。为此，cognito 需要用户名和密码才能登录。

在我的认知用户池中，我创建了自定义属性

custom:facialId 在下面的代码中，我尝试使用faceio登录，之后我调用cognito api使用自定义属性登录。我还创建了 lambda 函数，用于使用自定义属性对用户进行身份验证。但在 React js 本身中我遇到了错误，

client.send 登录时需要用户名和密码标准属性。我还检查了文档，单独使用自定义属性是不可能登录的。

我在我的react js应用程序中尝试过，它需要用户名和密码。

const handleFacialSignIn = async () => {
    if (!faceio) {
      console.error("faceio is not defined");
      return;
    }

    faceio
      .authenticate({
        locale: "auto", // Default user locale
      })
      .then((userData) => {
        console.log("Success, user identified");
        // Grab the facial ID linked to this particular user which will be same
        // for each of his successful future authentication. FACEIO recommend
        // that your rely on this Facial ID if you plan to uniquely identify
        // all enrolled users on your backend for example.
        console.log("Linked facial Id: " + userData.facialId);
        // Grab the arbitrary data you have already linked (if any) to this particular user
        // during his enrollment via the payload parameter of the enroll() method.
        console.log("Payload: " + JSON.stringify(userData.payload)); // {"whoami": 123456, "email": "[email protected]"} from the enroll() example above

        localStorage.setItem("facialId", userData.facialId);  
     

        const client = new CognitoIdentityProviderClient({ 
          region: awsRegion,
          credentials: {
            accessKeyId: 'xxxxxxx', 
            secretAccessKey: 'xxxxx', 
            sessionToken: 'xxxxxx' // This is optional
          }
        });

        const authParams = {
          AuthFlow: 'ADMIN_NO_SRP_AUTH',
          ClientId: clientId,        
          UserPoolId: userPoolId,   
          AuthParameters: {
              'custom:facialId': userData.facialId, 
          }
        };

        const command = new AdminInitiateAuthCommand(authParams);

      client.send(command)
      .then((response) => {        
        console.log(response);
      })
      .catch((error) => {
        console.error(error);
      });


        navigate("/dashboard");
      })
      .catch((errCode) => {
        console.error(errCode);
        setError("Error signing in using facial recognition");
      });
  };

下面是我的 lamda 触发函数，它在登录前调用

import pkg from '@aws-sdk/client-ses';
const { AWS } = pkg;


const handler = async (event) => {
 
    // const customAttribute = event.customAttribute;
    const customAttribute = "fffffffffffff";
    
    try {
        // Initialize Cognito Identity Provider
        const cognitoIdentityServiceProvider = new AWS.CognitoIdentityServiceProvider();
        
        // Query the User Pool for users with the provided custom attribute
        const params = {
            UserPoolId: 'xxxxxx_xxxxxxx',
            Filter: `custom:facialId = "${customAttribute}"`,
            Limit: 1 // Assuming the custom attribute uniquely identifies users
        };
            
        const data = await cognitoIdentityServiceProvider.listUsers(params).promise();
            
        // If a user with the provided custom attribute exists
        if (data.Users.length > 0) {
            const user = data.Users[0];

            // Authenticate the user using adminInitiateAuth
            const authParams = {
                AuthFlow: 'ADMIN_NO_SRP_AUTH',
                ClientId: 'xxxxxx_xxxxxxx',
                UserPoolId: 'xxxxxx_xxxxxxx',
                AuthParameters: {
                    USERNAME: user.Username, // Use the user's username as the custom attribute value
                    // You may need to add other parameters here depending on your configuration
                }
            };
            const authData = await cognitoIdentityServiceProvider.adminInitiateAuth(authParams).promise();
            
            return {
                statusCode: 200,
                body: JSON.stringify(authData)
            };
        } else {
            return {
                statusCode: 404,
                body: JSON.stringify({ message: 'User not found' })
            };
        }
    } catch (error) {
        return {
            statusCode: 500,
            body: JSON.stringify({ message: 'Internal server error' })
        };
    }
};


export { handler };

Answer 1

您似乎在询问如何使用 Cognito 从 React 应用程序登录用户（在您的 Face rec 登录之后）。

AWS Code Github 中有该用例的示例，您可以参考了解如何执行此用例。

注意应用程序中的登录按钮。

查看源代码和登录组件。你可以在这里找到它：

https://github.com/awsdocs/aws-doc-sdk-examples/tree/main/applications/photo-asset-manager