使用 Amazon Cognito 和 Web3 代理在 Amazon API Gateway 进行 dApp 身份验证

关键要点

本文介绍如何构建一个去中心化应用dApp，名为 “NFT Gallery”，并通过 Amazon Cognito 进行身份验证。使用 Amazon API Gateway 来安全代理对第三方 Web3 API 的请求。用户可以通过连接数字钱包进行身份验证，而不需要传统的用户名和密码。

如果您的去中心化应用dApp需要直接与 AWS 服务如 Amazon S3 或 Amazon API Gateway交互，您必须通过授予用户临时 AWS 凭证来授权用户。此解决方案结合了 Amazon Cognito 和用户的数字钱包，以为用户获取有效的 Amazon Cognito 身份和临时 AWS 凭证。本文还阐释了如何使用 Amazon API Gateway 来保护和代理对第三方 Web3 API 的 API 调用。

在本博客中，您将构建一个完全无服务器的去中心化应用dApp“NFT Gallery”。该 dApp 允许用户使用以下两个 Web3 提供商的 HTTP API 查找他们自己的非同质化代币NFT或任何其他 NFT 集合，分别是 Alchemy 和 Moralis。这些 API 帮助将 Web3 组件集成到任何网页应用中，无需区块链技术知识或访问权限。

解决方案概述

您的 dApp 用户界面UI是一个用 JavaScript 编写的单页应用SPA，使用 ReactJS、NextJS 和 Tailwind CSS。

该 dApp 通过 Amazon Cognito 进行身份验证和授权，并通过 Amazon API Gateway 来代理来自后端 Web3 提供商 API 的数据。

架构图

图 1 显示 Web3 的身份验证和 API 请求代理解决方案的架构图

前提条件

在您的计算机上安装 Nodejs、yarn 或 npm，以及 AWS Serverless Application Model Command Line Interface (AWS SAM CLI)。拥有一个 AWS 帐户及适当的 AWS 身份与访问管理 (IAM) 权限，以部署该架构所需的资源。在您的浏览器中安装数字钱包扩展并连接到以太坊区块链。 Metamask 是一个流行的数字钱包。获取一个 Alchemy 账户免费和以太坊区块链的 API 密钥，更多信息请查阅 Alchemy 快速入门指南。注册一个 Moralis 账户免费和 API 密钥，更多信息请查阅 Moralis 入门文档。

使用 AWS SAM 框架

您将使用 AWS SAM 作为定义、构建和部署后端资源的框架。AWS SAM 基于 AWS CloudFormation 构建，使开发人员能够使用更简洁的语法定义无服务器组件。

操作步骤

克隆这个 GitHub 仓库。

构建和部署后端

源代码包含两个顶级文件夹：

backend：包含 AWS SAM 模板 templateyaml。查看 templateyaml 文件以获取有关此项目中部署资源的更多信息。

dapp：包含 dApp 的代码。

进入 backend 文件夹，复制 prodparametersexample 文件到一个名为 prodparameters 的新文件，并编辑以添加您的 Alchemy 和 Moralis API 密钥。

运行以下命令以处理 SAM 模板查看 sam build 开发者指南。

bash sam build

现在通过运行以下命令部署 SAM 模板查看 sam deploy 开发者指南。

bash sam deploy parameteroverrides (cat prodparameters) capabilities CAPABILITYNAMEDIAM guided confirmchangeset

SAM 将询问您一些问题，并生成一个 samconfigtoml，其中包含您的回答。

此后，您可以根据需要编辑此文件。未来的部署将使用 toml 文件并可以通过 sam deploy 运行。请勿将 samconfigtoml 文件提交到代码仓库，因为它包含私密信息。

在几分钟后，您的 CloudFormation 堆栈应已成功部署，Outputs 部分应该显示您必须在 dapp 文件夹中的网页应用中引用的资源。

运行 dApp

现在，您可以在本地运行您的 dApp。

进入 dapp 文件夹，并将 envexample 文件复制到名为 env 的新文件。编辑此文件以添加 dApp 所需的后端资源值。请参照 envexample 文件中的说明。

运行以下命令以安装 JavaScript 依赖项：

bash yarn

通过运行以下命令在本地启动开发 Web 服务器：

bash yarn dev

您的 dApp 现在应在 http//localhost3000 上可访问见图 2。

图 2 NFT 收藏查找应用

部署 dApp

SAM 模板创建一个 Amazon S3 存储桶和一个 Amazon CloudFront 分发，准备在互联网上提供您的 单页应用 (SPA)。

您可以通过 CloudFront 分发的 URL 从互联网上访问您的 dApp。此 URL 在您的 CloudFormation 堆栈 Output 选项卡中可见，或作为 sam deploy 命令的输出。

目前，您的 S3 存储桶是空的。构建 dApp 的生产版本并上传代码到 S3 存储桶，运行以下命令：

bashcd dapp yarn build cd out aws s3 sync s3//{BUCKETNAME}

将 {BUCKETNAME} 替换为您的 S3 存储桶名称。

使用 SAM Pipelines 自动化部署

SAM Pipelines 会自动为无服务器应用生成部署管道。如果对您的 Git 仓库进行更改，它会自动部署您的 CloudFormation 堆栈和 dApp 代码。

通过 SAM Pipeline，您可以选择一个 Git 提供商，如 AWS CodeCommit，以及一个构建环境，如 AWS CodePipeline，以自动配置和管理您的部署管道。它还支持 GitHub Actions。

阅读更多关于 sam pipeline bootstrap 命令的信息以开始使用。

使用星际文件系统 (IPFS) 托管您的 dApp

IPFS 是一种以去中心化的方式托管 dApp 的良好解决方案。IPFS 网关 (IPFS Gateway) 可以作为您的 CloudFront 分发的源，并通过 HTTP 提供 IPFS 内容。

dApp 通常托管在 IPFS 上以提高可信度和透明度。使用 IPFS，您的网站应用源代码和资产不再依赖于 DNS 名称和特定 HTTP 主机，而是独立存在于 IPFS 网络上。

阅读更多关于 在 IPFS 上托管单页网站 和 如何在 AWS 上运行自己的 IPFS 集群 的信息。

实施细节

在本节中，我们将展示如何：

通过其数字钱包通过 Amazon Cognito 用户池进行用户身份验证。通过授权验证，对经过身份验证和未经过身份验证的用户保护 API Gateway。使用 API Gateway HTTP 透传和 AWS Lambda 代理集成，安全调用 Alchemy 和 Moralis 第三方 API。使用 JavaScript Amplify 库 从您的网页应用与 Amazon Cognito 和 API Gateway 进行交互。

身份验证

您的 dApp 可供经过身份验证和未经过身份验证的用户使用。未经过身份验证的用户可以查看 NFT 集合，而经过身份验证的用户还可以查看自己的 NFT。

在您的 dApp 中，没有用于身份验证的登录/密码组合或 身份提供者 (IdP)。相反，用户将他们的数字钱包连接到网页应用。

为了捕获用户的钱包地址并授予他们临时的 AWS 凭证，您可以使用 Amazon Cognito 用户池 和 Amazon Cognito 身份池。

您可以通过实现 Amazon Cognito 自定义身份验证挑战 创建自定义身份验证流程，该流程使用 AWS Lambda 触发器。此挑战要求用户通过其数字钱包签署生成的消息。如果签名有效，证明用户拥有该钱包地址。然后该钱包地址用作 Amazon Cognito 用户池中的用户标识符。

图 3 详细说明了 Amazon Cognito 身份验证过程。三个 Lambda 函数用于执行不同的身份验证步骤。

图 3 Amazon Cognito 身份验证过程

为定义身份验证成功条件，Amazon Cognito 用户池调用“定义身份验证挑战”Lambda 函数 (defineAuthChallengejs)。为生成挑战，Amazon Cognito 调用“创建身份验证挑战”Lambda 函数 (createAuthChallengejs)。在此情况下，它生成一个随机消息供用户签署。Amazon Cognito 将挑战转发给 dApp，用户使用他们的数字钱包和私钥签署此消息，dApp 然后将签名作为响应返回给 Amazon Cognito。为验证用户的钱包确实签署了该消息，Amazon Cognito 将用户的响应转发给“验证身份验证挑战响应”Lambda 函数 (verifyAuthChallengeResponsejs)。如果为真，则 Amazon Cognito 身份验证用户并在用户池中创建一个以钱包地址为 username 的新身份。最后，Amazon Cognito 返回一个 JWT 令牌给 dApp，其中包含多个声明，其中之一为 cognitousername，包含用户的钱包地址。这些声明将传递给您的 AWS Lambda 事件 和 Amazon API Gateway 映射模板，使后端能够安全识别进行这些 API 请求的用户。

授权

Amazon API Gateway 提供多种方法来授权访问 API 路由。此示例展示了三种不同的授权方法：

AWSIAM：使用 IAM 角色进行授权。IAM 角色授予对特定 API 路由或其他 AWS 资源的访问权限。用户假定的 IAM 角色由 Amazon Cognito 身份池授予。COGNITOUSERPOOLS：使用 Amazon Cognito 用户池进行授权。通过验证用户的 Amazon Cognito 令牌来保护 API 路由。NONE：不进行授权。API 路由对公共互联网开放。

API Gateway 后端集成

HTTP 代理集成

HTTP 代理集成方法允许您将 HTTP 请求代理到另一个 API。请求和响应可以原样传递，或者您可以使用 映射模板 随时修改。

这种方法是一种成本效益高的方式来保护对任何第三方 API 的访问。原因是您的第三方 API 密钥存储在 API Gateway 中，而不是在前端应用上。

您还可以在 API Gateway 上启用缓存，以减少对后端 API 的 API 调用数量。这将提高性能、降低成本并控制使用。

查看 SAM 模板中的 GetNFTsMoralisGETMethod 和 GetNFTsAlchemyGETMethod 资源，以了解如何使用映射模板修改传入请求的头部、路径或查询字符串。

Lambda 代理集成

黑石加速器官网入口

API Gateway 可以使用 AWS Lambda 作为后端集成。Lambda 函数允许您在返回响应给 dApp 之前实现自定义代码和逻辑。

在 backend/src 文件夹中，您将找到两个 Lambda 函数：

getNFTsMoralisLambdajs：调用 Moralis API 并返回原始响应。getNFTsAlchemyLambdajs：调用 Alchemy API 并返回原始响应。

要从 Lambda 函数代码中访问已通过身份验证用户的钱包地址，请如下访问 cognitousername 声明：

javascriptvar walletaddress = eventrequestContextauthorizerclaims[cognitousername]

在 dApp 中使用 Amplify 库

dApp 使用 AWS Amplify JavaScript 库 与 Amazon Cognito 用户池、Amazon Cognito 身份池和 Amazon API Gateway 进行交互。

使用 Amplify 库，您可以与 Amazon Cognito 自定义身份验证流程进行交互，为前端获取 AWS 凭证，并对您的 API Gateway 端点进行 HTTP API 调用。

使用 Amplify Auth 库 执行身份验证流程。要注册、登录并响应 Amazon Cognito 自定义挑战，请使用 Amplify Auth 库。查看 ConnectButtonjs 和 userjs 文件以获取更多信息。

要对您的 API Gateway 进行 API 调用，可以使用 Amplify API 库。查阅 dApp 中的 apijs 文件以了解如何以不同的 API 路由进行 API 调用。请注意，某些路由受到 AWSIAM 授权保护，而另一些则受到 COGNITOUSERPOOL 保护。

根据当前的身份验证状态，您的用户将自动假定 Amazon Cognito 身份池中引用的 CognitoAuthorizedRole 或 CognitoUnAuthorizedRole IAM 角色。AWS Amplify 将在调用由 AWSIAM 授权方法保护的 API 路由时自动使用与您的 AWS IAM 角色关联的凭证。

Amazon Cognito 身份池 允许匿名用户假定 CognitoUnAuthorizedRole IAM 角色。这使得即使是匿名用户也可以安全访问您的 API 路由或您配置的其他 AWS 服务。您的 API 路由将不会对互联网公开可用。

清理资源

为避免产生未来费用，请删除由 SAM 创建的 CloudFormation 堆栈。运行 sam delete 命令或直接在 AWS 管理控制台中删除 CloudFormation 堆栈。

结论

在这篇文章中，我们展示了如何使用不同的 AWS 托管服务在 AWS 上运行和部署去中心化网页应用dApp。我们还展示了如何与 Web