AWS Cognito托管UI并使用授权代码OAuth流程放大Auth

时间:2020-02-28 01:56:36

标签: amazon-web-services vue.js amazon-cognito aws-amplify

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

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

import { Auth } from "aws-amplify";

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

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

我确实知道授权代码授予不会将令牌放在URL中,但是即使在首次登录时,我也确实将它们存储在本地存储中。我尝试切换为使用“令牌” OAuth流程,但使用了Amplify文档说没有提供刷新令牌,我不想将会话限制为1小时。这里有指导吗?

1 个答案:

答案 0 :(得分:3)

对于任何面临相同问题的人,这似乎是一个已知问题。

解决方法是订阅集线器动作并在那里进行处理

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