AWS Cognito托管UI和Amplify Auth，授权代码为OAuth流

Question

我有一个Vue.js网络应用程序，我正在尝试使用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不会将其识别为正在进行身份验证。但是，如果我第二次登录，控制台中不会出现错误，并且我有一个经过身份验证的会话。

我知道授权码grant不会将令牌放入URL中，但即使在第一次登录时，我也会在本地存储中看到它们。我曾尝试切换到使用"令牌"OAuth流，但Amplify文档表示刷新令牌不是这样提供的，我不希望会话限制在1小时内。这里有什么指导吗？

Answer 1

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

解决方法是订阅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