如何在我的 React 应用程序中列出我的 Cognito 用户池中的所有用户？答案

【问题标题】：How do I list all users in my Cognito User Pool in my React application?如何在我的 React 应用程序中列出我的 Cognito 用户池中的所有用户？
【发布时间】：2021-06-04 07:26:25
【问题描述】：

我有一个网站编辑可以登录的 CMS 应用程序。我想为编辑创建一个仪表板，以便能够创建和删除站点用户。站点用户账户将通过 AWS Cognito 用户池进行维护，而站点编辑通过其在 CMS 中的账户登录。

首先，我希望能够列出给定用户池中的所有用户以供编辑查看，因此我正在关注 SDK 文档 here，但它没有解释如何传递任何凭据到方法。这是 SDK 的 v3，我能找到的任何类似的示例都使用 v2。

我已经走到这一步了：

import { CognitoIdentityProviderClient, ListUsersCommand } from "@aws-sdk/client-cognito-identity-provider";

const client = new CognitoIdentityProviderClient({ region: "eu-west-2" });
const params = {};
const command = new ListUsersCommand({ UserPoolId: "My_User_Pool_Id" });

try {
    const data = await client.send(command);
    return this.setState({ users: data });
} catch (error) {
    console.error(error);
    return this.setState({ error: error });
} finally {
    this.setState({ loading: false });
}

但是当我运行上面的代码并渲染组件时，这给了我一个错误：

Error: Credential is missing
    at SignatureV4.credentialProvider (runtimeConfig.browser.js:15)
    at SignatureV4.<anonymous> (SignatureV4.js:169)
    at step (tslib.es6.js:100)
    at Object.next (tslib.es6.js:81)
    at tslib.es6.js:74
    at new Promise (<anonymous>)
    at __awaiter (tslib.es6.js:70)
    at SignatureV4.signRequest (SignatureV4.js:165)
    at SignatureV4.<anonymous> (SignatureV4.js:85)
    at step (tslib.es6.js:100)

我假设我需要为我的仪表板创建一些凭据（通过 IAM？）以访问用户池，但我不知道在哪里创建这些凭据或如何将它们传递给 SDK。围绕这个主题进行谷歌搜索似乎建议我应该创建一个未经身份验证的 Identity 池并将 IAM 权限附加到该池，然后将该池的凭据传递给 SDK，但这也给了我权限错误：

AccessDeniedException: User: [DashboardAdmin IdentityPool ARN] is not authorized to perform: cognito-idp:ListUsers on resource: [UserPool for Site Users ARN]

【问题讨论】：

您的应用如何验证网站编辑器的身份？
CMS (Sanity.io) 为编辑提供了自己的身份验证和登录流程。我们有一个单独的网站用户身份验证系统，因为我们不需要/不希望用户能够访问网站的 CMS 部分。

标签： amazon-web-services amazon-cognito aws-sdk-js

【解决方案1】：

我最终找到了 v3 文档中关于获取和设置凭据的正确部分。

如here 所述，您可以通过新的 IAM 用户为您的应用程序创建凭证来获取凭证。

根据this guide，您可以通过多种不同的方式将它们添加到您的应用中，具体取决于您是在服务器端还是在客户端工作。例如，在服务器端对它们进行硬编码需要进行以下更改：

const client = new CognitoIdentityProviderClient({ region: "eu-west-2" });

改成

const client = new CognitoIdentityProviderClient({
    region: "eu-west-2",
    credentials: {
        accessKeyId: process.env.YOUR_AWS_ACCESS_KEY_ID,
        secretAccessKey: process.env.YOUR_AWS_SECRET_ACCESS_KEY,
    },
});

然后，通过向您在上面创建的 IAM 用户添加允许 cognito-idp:ListUsers 的策略来解决错误 User is not authorized to perform: cognito-idp:ListUsers on resource。 This answer 引导我朝着正确的方向前进。

【讨论】：