AWS 放大如何使用 Redux 在 React 应用程序上实现 currrentSession?
AWS amplify how to implement currrentSession on a React app with Redux?
let session = Auth.currentSession();
// CognitoUserSession => { idToken, refreshToken, accessToken }
检索工作正常的当前会话。
但是,我不确定如何使用 Redux 将其实现到我的 React 应用程序中。
当用户重新加载网页以及登录用户的所有 UI 时,存储的所有数据都会消失。
只要 CognitoUserSession 有效,我想保持登录状态,即使用户刷新页面也是如此,并且可能保留一些我已经在商店中的数据。
实现这个的最佳方法是什么?
aws-amplify 大量使用 localStorage。你也可以。
您也可以使用 sessionStorage,除了在 window 关闭后所有内容都被删除之外,它是一样的东西。
如果你想保存一些东西:
window.localStorage.setItem(“itemKey”, “itemString”);
取回:
const item = window.localStorage.getItem(“itemKey”);
请注意:如果您想保存一个对象,您需要 JSON.stringify 它,然后在您检索它时 JSON.parse 它。您只能存储字符串。
作为一般规则,我不会在 localStorage 上存储敏感信息。
此外,我倾向于 运行 在某些组件挂载或更新时对它们进行某种会话检查。例如,您可以添加:
if (!this.props.session) { // stored session object in redux
Auth.currentSession().then((session) => {
handleSession({ session }); // redux action to store session
});
}
思路是:如果页面刷新,会挂载这些session检查的组件,运行上面的if语句,实现session为空,尝试从Auth获取新的session对象。如果 Auth returns 由于用户不再经过身份验证而出错,您可以添加额外的逻辑以重定向到您的登录屏幕。
let session = Auth.currentSession();
// CognitoUserSession => { idToken, refreshToken, accessToken }
检索工作正常的当前会话。
但是,我不确定如何使用 Redux 将其实现到我的 React 应用程序中。 当用户重新加载网页以及登录用户的所有 UI 时,存储的所有数据都会消失。
只要 CognitoUserSession 有效,我想保持登录状态,即使用户刷新页面也是如此,并且可能保留一些我已经在商店中的数据。
实现这个的最佳方法是什么?
aws-amplify 大量使用 localStorage。你也可以。
您也可以使用 sessionStorage,除了在 window 关闭后所有内容都被删除之外,它是一样的东西。
如果你想保存一些东西:
window.localStorage.setItem(“itemKey”, “itemString”);
取回:
const item = window.localStorage.getItem(“itemKey”);
请注意:如果您想保存一个对象,您需要 JSON.stringify 它,然后在您检索它时 JSON.parse 它。您只能存储字符串。
作为一般规则,我不会在 localStorage 上存储敏感信息。
此外,我倾向于 运行 在某些组件挂载或更新时对它们进行某种会话检查。例如,您可以添加:
if (!this.props.session) { // stored session object in redux
Auth.currentSession().then((session) => {
handleSession({ session }); // redux action to store session
});
}
思路是:如果页面刷新,会挂载这些session检查的组件,运行上面的if语句,实现session为空,尝试从Auth获取新的session对象。如果 Auth returns 由于用户不再经过身份验证而出错,您可以添加额外的逻辑以重定向到您的登录屏幕。