AWS Cognito JS如何允许访问s3对象（特定的html页面）

Question

我在s3托管网站中有3个html文件，一个register.html，login.html和dashboard.html

注册和登录工作最终得到一个访问令牌。

如何限制对dashboard.html的访问，然后以某种方式使用访问令牌来允许对其进行访问？

Answer 1

使用JavaScript而不限制访问

对于此类问题，直接的方法是加载dashboard.html，并在dashboard.html主体中具有JavaScript，以通过验证用户是否已经登录（例如，检查Cognito）来切换内容的显示。本地存储中的JWT令牌），并重定向到未经身份验证的用户登录到login.html。

注意：如果您计划使用AWS Cognito UserPools托管UI，此方法也将很有用。

限制访问

如果您打算继续限制对dashboard.html的访问，则可以使用CloudFront Signed Cookies来实现它，如下所示。

• 通过AWS CloudFront设置S3访问（创建原始访问身份-OAI），并将S3存储桶设为私有（对于所有三个页面）。 在注册S3来源时，将使用向导进行OAI。
• 为每个html文件创建三种不同的行为。
• 对于login.html和register.html行为，将“ 限制查看器访问权限（使用签名的URL或签名的Cookie）”设置为“否”。
• 仅限于dashboard.html，将“ 限制查看者访问权限（使用签名的URL或签名的Cookie）”设置为“是”
• 当用户尝试直接访问dashboard.html（无登录）时，CloudFront将返回错误。 因此，将AWS CloudFront错误响应配置为Login.html。
• 创建一个API网关和Lambda端点以从登录页面验证Cognito JWT令牌，并在Lambda中创建一个签名Cookie，并在setCookie标头中将其返回。
• 当存在Cookie时，浏览器将发送Cookie标头，CloudFront将允许加载dashboard.html。