29

我刚刚潜入 Cognito。AWS 设置相当简单明了。

我们有各种各样的应用程序、网络应用程序和服务，我们希望它们能够使用 Cognito 服务。我有使用 Auth0 进行类似设置的经验，但是因为我们一直在利用许多 Amazon Web Services，所以使用 Cognito 也很有意义。

在我所见的任何地方，每个指南最终都会引用 Amplify 客户端库和 cli。我们有现有的应用程序和服务，并且真的不想更改工具或导入任何不必要的东西来增加臃肿和复杂性。有没有办法在没有 Amplify 库的情况下使用 Cognito 服务？是否有用于与 Cognito 服务、身份验证和授权流程交互的轻量级 Cognito 客户端库？

4

3 回答 3

24

2021 年 12 月 3 日更新

在 re:Invent 2021 之后，“Amplify Admin UI”更名为“Amplify Studio”。现在拥有额外的权力：

  • 自动将 Figma 中的设计转换为人类可读的 React UI 组件代码

https://aws.amazon.com/blogs/mobile/aws-amplify-studio-figma-to-fullstack-react-app-with-minimal-programming/

================

原始答案

首先，我想澄清一下“放大”是多个事物的总称。我们有：

  1. 放大库 (UI/JS)
  2. Amplify CLI（创建云原生应用程序）
  3. Amplify 控制台（用于全栈 Web 应用程序的 ci/cd 和托管）
  4. Amplify Admin UI（用于创建和配置全栈 Web 应用程序的 UI）

您可以查看主页以获得更多说明 - https://docs.amplify.aws/

是否有用于与 Cognito 服务、身份验证和授权流程交互的轻量级 Cognito 客户端库？

在幕后，Amplify 使用amazon-cognito-identity-js库与 Amazon Cognito 进行交互。您可以直接通过npm install amazon-cognito-identity-js.

源代码已移至Amplify 库（例如 amplify-js）存储库。再次，它是第一类“Amplify Libraries”下“Amplify”保护伞的一部分。

有没有办法在没有 Amplify 库的情况下使用 Cognito 服务？

您可以执行的另一种方法是将 Amazon Cognito 用作 OAuth 服务器。当您创建Amazon Cognito 托管 UI 域时，它会为您提供符合 OAuth 2.0 的授权服务器。

您可以为注册/登录终端节点创建自己的 API/后端，并与 Amazon Cognito OAuth 服务器交换令牌/凭证，而无需使用aws-sdk任何第三方依赖库。

我写了一个演练示例，如何配置您的用户池，您需要使用 Node.js 与之通信的端点，您可以在这里找到它：https ://github.com/oieduardorabelo/node-amazon-cognito-oauth

您可以对任何其他语言遵循相同的想法。

于 2021-03-19T02:06:16.960 回答
1

几年前我写了一篇文章解释如何做到这一点。

这篇文章谈到了 Amplify，但正如另一个回复中提到的那样，这更像是一个概括性的术语，在文章中我们主要使用 Amplify 项目提供的 UI 组件。

你可以在这里找到它：https ://medium.com/@mim3dot/aws-amplify-cognito-part-2-ui-components-935876fabad3

于 2021-06-24T17:52:36.287 回答
0

正如@oieduardorabelo 所提到的，您可以简单地安装“amazon-cognito-identity-js”，您还可以在 npm 上找到做得好的示例。

这是我的测试代码，可以轻松理解这个库。您必须已经在 AWS 上构建了基础设施（userPool、userClient 并添加了一个新用户来测试登录 - 在我的情况下，用户必须在首次登录时更改密码，所以我在我的脚本中添加了这个用例）：

import * as AmazonCognitoIdentity from 'amazon-cognito-identity-js';

var authenticationData = {
  Username: 'email',
  Password: 'password',
};
var authenticationDetails = new AmazonCognitoIdentity.AuthenticationDetails(authenticationData);
var poolData = {
  UserPoolId: 'us-east-1_userpoolid',
  ClientId: '26pjexamplejpkvt'
};
var userPool = new AmazonCognitoIdentity.CognitoUserPool(poolData);
var cognitoUser = userPool.getCurrentUser();

console.log(cognitoUser);

if (!cognitoUser) {

  var userData = {
    Username: authenticationData.Username,
    Pool: userPool
  };
  var cognitoUser = new AmazonCognitoIdentity.CognitoUser(userData);
  cognitoUser.authenticateUser(authenticationDetails, {
    onSuccess: function (result) {
      var accessToken = result.getAccessToken().getJwtToken();
      var idToken = result.idToken.jwtToken;
      console.log('Success', accessToken, idToken);
    },
    newPasswordRequired: function (userAttributes, requiredAttributes) {
      delete userAttributes.email_verified;
      cognitoUser.completeNewPasswordChallenge('DemoPassword1!', userAttributes, {
        onSuccess: (data) => {
          console.log(data);
        },
        onFailure: function (err) {
          alert(err);
        }
      });
    },
    onFailure: function (err) {
      alert(err);
    },

  });
}

如果有人有兴趣从头开始设置此测试项目，请运行：

npm init -y
npm i -D webpack webpack-cli
npm i amazon-cognito-identity-js

在 webpack.config.js 中：

var path = require('path');

module.exports = {
  entry: './src/app.js',
  mode: 'development',
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: 'main.js',
  }
}

在 ./src/app.js 中创建一个新文件，在其中使用正确的 AWS 信息参考添加先前的 amazonCognitoIdentity 代码并创建 ./dist/index.html ：

...
<body>
  <script src="main.js"></script>
</body>

在 package.json 添加脚本“watch”：

...
"scripts": {
    "watch": "webpack --watch",
}

最后运行它：

npm run watch

并使用开发控制台直接在浏览器上打开 index.html。

希望对某人有用。

于 2022-02-27T14:04:45.067 回答