javascript - 如何将 aws cognito 与 Web 联合和 javascript 结合使用

转载作者：行者123 更新时间：2023-11-30 20:03:38

26

4

我正在尝试将 AWS Cognito 与身份提供商(使用亚马逊登录)一起使用，为我的 JavaScript 应用程序提供登录功能。经过大量搜索，我不得不问你们:你们能给我指一个描述步骤的好教程吗？我知道那里有很多文档，但要么文档不完整，要么是没有使用 cognito 的文档。到目前为止我所拥有的是:

我已经注册了应用
我已经使用从 (1) 获得的应用程序 ID 创建了一个身份池

我尝试了以下方法来创建具有功能的登录按钮，但这不起作用:

<!DOCTYPE html>
<html>
    <head>
        <script src="aws-sdk.js" type="text/javascript"></script>
        <script>
            // Initialize the Amazon Cognito credentials provider
            AWS.config.region = 'eu-west-1'; // Region
            AWS.config.credentials = new AWS.CognitoIdentityCredentials({
                IdentityPoolId: 'xxx',
            });

        </script>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div>TODO write content</div>
        <a href id="LoginWithAmazon">
            <img border="0" alt="Login with Amazon"
                 src="https://images-na.ssl-images-amazon.com/images/G/01/lwa/btnLWA_gold_156x32.png"
                 width="156" height="32" />
        </a>
<script>
document.getElementById('LoginWithAmazon').onclick = function() {
    options = { scope : 'profile' };
    amazon.Login.authorize(options, 'MY_REDIRECT_URL');
    return false;
  };
</script>
    </body>
</html>

我没有收到重定向，也没有看到登录弹出窗口。提前致谢。

最佳答案

您在问题中提到您希望使用 Amazon Cognito 为您的应用程序提供登录功能。

Amazon Cognito 支持两个实体，这两个实体在本质上是高度解耦的:

用户池
身份池

用户池允许您向 Web 或移动应用程序添加身份验证，而身份池允许经过验证/未经验证的用户访问身份池设置中 IAM Angular 色中指定的一组 AWS 资源。 Cognito Identity Pools 不充当身份验证器，而是充当授权器，并在后端运行 get-credentials-for-identity API 调用后出售临时 AWS 凭证。

根据我从您的用例中了解到的情况，您希望在您的 JavaScript Web 应用程序中有一个“使用亚马逊登录”按钮，在成功验证 JWT [1] 后，该按钮会将您带到一个网页。要实现此用例，应使用 Amazon Cognito 用户池。首先，您需要将 Amazon 作为身份提供商集成到您创建的用户池中 [2]。之后，您需要通过为您的用户池启动一个身份验证对象来在您的代码中提及相同的内容:

 function initCognitoSDK() {
        var authData = {
            ClientId : '<TODO: your app client ID here>', // Your client id here
            AppWebDomain : '<TODO: your app web domain here>', // Exclude the "https://" part. 
            TokenScopesArray : <TODO: your scope array here>, // like ['openid','email','phone']...
            RedirectUriSignIn : '<TODO: your redirect url when signed in here>',
            RedirectUriSignOut : '<TODO: your redirect url when signed out here>',
            IdentityProvider : '<TODO: your identity provider you want to specify here>', 
                    UserPoolId : '<TODO: your user pool id here>', 
                    AdvancedSecurityDataCollectionFlag : <TODO: boolean value indicating whether you want to enable advanced security data collection>
        };

在开发您的应用程序时，您可以引用此示例应用程序[3]，因为它具有相同的用例。

希望这个回答能帮到你。

引用资料

[1]。 https://docs.aws.amazon.com/cognito/latest/developerguide/amazon-cognito-user-pools-using-tokens-verifying-a-jwt.html

[2]。 https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-user-pools-social-idp.html

[3]。 https://github.com/aws/amazon-cognito-auth-js/tree/master/sample

关于javascript - 如何将 aws cognito 与 Web 联合和 javascript 结合使用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53136200/

26

4

0

文章推荐： c# - 将图像保存到 HDD 或存储为数据库中的字节数组？

文章推荐： c# - 从大量声音文件中播放

去泛型 - 联合
我正在通过修改我为处理 slice 而创建的库来玩转泛型。我有一个 Difference接受 slice 并返回仅在其中一个 slice 中找到的唯一元素列表的函数。我修改了函数以使用泛型，并且我正
数组和对象类型的 typescript 联合
Typescript 编译器在我尝试使用联合或多个类型/接口(interface)时不断抛出错误。 My requirement 我从服务器收到一个对象作为响应，其中一个键 ('errorMessa
具有不同列数的 SQLAlchemy 联合
我需要在 SQLAlchemy 中执行 2 选择。例如: select1 = Session.query(col1, col2, col3, col4).filter(...) select2 = S
单独列中的 SQL 联合
我建立了一个数据库来输入我所有的头痛和偏头痛跟踪数据。我正在提取一些查询，这些查询显示某一年中按月计算的不同头痛严重程度的计数。我有一个查询按月得到所有头痛，另一个在一定严重程度下得到头痛，最后一个在
sql - 联合、排除或拦截以在选择中使用默认数据？
我有三个表，一个是默认值表。我需要做的是选择 TableA 和 TableB 的值，并从默认值的选择中回填任何缺失的值。每个表都有一个键和值列。数据的一个例子可能是这样的: DefaultTab
多个不同路径的 JSONPath 联合
我正在尝试构建一个单个 JSONPath 查询，它将测试是否存在两个或多个路径。让我们考虑以下示例文档: { "firstName": "John",
基于嵌套对象内部属性的 Typescript 联合
我正在尝试基于对象中的嵌套属性创建联合类型。请参见下面的示例: type Foo = { abilities: { canManage: boolean } } typ
MySQL 联合、连接和限制
我有以下查询: SELECT result.globalId AS id, result.date, p1.playerName AS player, p2.playerName AS targe
MySQL 表合并/联合？
我有两张 table 。第一个每天刷新。(该表有超过 10 列，但其中 2 列是相关的)我想根据 vid (这是一个唯一的 id )和人口进行每日统计。新的视频 ID 每天都会出现和消失。例如: 第一
返回时具有不同列的 MySQL 联合
这个问题已经有答案了: How to know what table a result came from when using UNION in MySQL (1 个回答) 已关闭 6 年前。让我
MySQL 联合/完全外连接未返回预期结果
我有 2 个表，一个列出人员及其与其属性的关系，另一个表列出属性(名字、姓氏等)。人员表中的每个人可能不具有属性表中列出的所有属性。我想要的是每个人都为每个属性返回一行，无论他们是否有链接。举个例
mysql - 联合 - 启用麻烦
假设我们有 MySQL 服务器 A，我们需要在其中创建位于服务器 B 上的表的“副本”。我们没有启用联合。重置服务器 A 会造成很多麻烦，我相信，我们不能在不重置的情况下启用联合。我也认为在B服务器
java - 在方法内部测试方法的最佳方法是什么？ (联合)
我有一个 Java 类 A。A 的构造函数调用了几个方法 m1、m2。 class A{ public A(){ m1(); m2(); ......
algorithm - 范围交集/联合
我正在开发一种编程语言，我想为其提供一个Range 数据类型，目前它不是通常的int 对列表。值 (x,y)约束条件是 x < y .我说不像通常那样，因为通常一个范围只是一对，但在我的例子中，它超过
C# 合并两个排序列表(联合？)
我正在寻找加速一段合并两个 SortedLists 的代码。 C# 4.0 通用 SortedList:http://msdn.microsoft.com/en-us/library/ms132319
javascript - 具有依赖类型的 Typescript 联合
如果我有以下包含函数及其参数的联合，我该如何调用它？ type Wrapper = { fn: (a: string) => void arg: string } | { fn: (a:
delphi - 移植 C 联合
我正在尝试移植一个内部有一个联合的 C 结构。 Winapi.Winsock2.pas 中的默认结构记录中缺少某些字段。但这是正确的方法吗？谢谢。 typedef struct _WSACOMPLE
SQL:排序依据、子字符串、联合
我希望通过“版本”编号的前 8 个字符的子字符串对以下查询的结果进行排序。我理解 SUBSTRING()，所以不要用这个来打扰我。我的问题是尝试实际放置关于 UNION 的 ORDER BY。更新:
symfony - 与 Doctrine 联合
我需要创建一个带有联合的 QueryBuilder，这可能吗？ $qb = $this->em->createQueryBuilder() ->select('table1.numObject
php - 加入、联合、合并？
我正在为 Magic the Gathering Cards 创建库存系统，需要使用主要卡片信息更新价格。我有两个表，卡片和价格卡片有以下列:ID、姓名、Ed、价格价格有以下列:姓名、Ed、价格

首页

博学

6Ren·AI

商城

javascript - 如何将 aws cognito 与 Web 联合和 javascript 结合使用

引用资料