时间戳

首页 > 解决方案 > AWS Cognito 托管 UI 和使用授权代码 OAuth 流放大身份验证

amazon-web-services - AWS Cognito 托管 UI 和使用授权代码 OAuth 流放大身份验证

问题描述

我有一个 Vue.js webapp，我正在尝试添加简单的身份验证以使用 AWS Cognito 和 Amplify Auth。我为 OAuth 流程启用了“授权码授予”设置了我的用户池。我还https://example.auth.us-east-2.amazoncognito.com/login?response_type=code&client_id=XXXXXXXX&redirect_uri=https://example.com/auth/verify为托管 UI 设置了重定向 URL。

这是托管 UI 重定向到的页面内的内容：

import { Auth } from "aws-amplify";

export default {
    async created() {
        try {
            await Auth.currentSession();
        } catch {
            console.error("Not authorized");
        }
    }
}

当我第一次通过托管 UI 登录并被重定向时，我收到一个错误并且 Amplify 未将其识别为已通过身份验证。但是，如果我第二次登录，控制台中没有错误，并且我有一个经过身份验证的会话。

我确实知道授权代码授予不会将令牌放在 URL 中，但即使在第一次登录时，我也会在 localstorage 中看到它们。我尝试切换到使用“令牌”OAuth 流程，但 Amplify 文档说刷新令牌不是以这种方式提供的，我不希望会话限制为 1 小时。这里有什么指导吗？

标签： amazon-web-servicesvue.jsamazon-cognitoaws-amplify

解决方案

对于任何面临同样问题的人来说，这似乎是一个已知问题。

解决方法是订阅 Hub 操作并在那里处理它

Hub.listen("auth", ({ payload: { event, data } }) => {
  switch (event) {
  case "signIn":
    // signin actions
    Auth.currentSession()
      .then(user => console.log(user)) // redirect to default page
      .error(err => console.log(err))
  case "signOut":
    // signout actions, redirect to '/' etc
  case "customOAuthState":
    // other changes
  }
}

参考https://github.com/aws-amplify/amplify-js/issues/5133#issuecomment-600759135

推荐阅读