AWS уточняет, как реализовать currrentSession в приложении React с Redux?

Документация по расширению AWS показывает

let session = Auth.currentSession(); // CognitoUserSession => { idToken, refreshToken, accessToken }

чтобы получить текущий сеанс, который работает нормально.

Однако я не уверен, как реализовать это в моем приложении React с Redux. Все данные в магазине исчезают, когда пользователь перезагружает веб-страницу вместе со всеми пользовательскими интерфейсами для вошедшего в систему пользователя.

Я хочу сохранить этап входа в систему, даже если пользователь обновит страницу, пока CognitoUserSession действителен и, возможно, сохранит некоторые данные, которые у меня уже есть в магазине.

Как лучше всего это реализовать?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
0
1 328
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

aws-ampify активно использует localStorage. Ты тоже можешь.

Вы также можете использовать sessionStorage, это то же самое, за исключением того, что все удаляется после закрытия окна.

Если вы хотите что-то спасти:

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
  });
}

Идея такова: если страница обновляется, компоненты с этими проверками сеанса будут монтироваться, выполнят оператор if, указанный выше, поймут, что сеанс пуст, и попытаются получить новый объект сеанса из Auth. Если Auth возвращает ошибку, потому что пользователь больше не аутентифицирован, вы можете добавить дополнительную логику для перенаправления на экран входа в систему.

Еще раз спасибо за помощь! Не могли бы вы взглянуть на это тоже? stackoverflow.com/questions/50580499/… :)

Ohsik 30.05.2018 06:10

Другие вопросы по теме