Блог

Главная - Вопросы по программированию - Распространенные способы хранения выбранных данных для приложения React?

Распространенные способы хранения выбранных данных для приложения React?

#javascript #reactjs #authentication #redux

#javascript #reactjs #аутентификация #сокращение

Вопрос:

Я работаю над веб-приложением React, в котором пользователь может создать учетную запись, которая будет содержать контактную информацию пользователя (телефон, адрес электронной почты, адрес). Когда пользователь входит в систему, ему должны быть доступны данные его учетной записи.

Как эта информация обычно собирается / хранится на стороне клиента в React? Вот что я думаю:

  1. Как только пользователь входит в систему, приложение извлекает информацию об учетной записи пользователя (например, используя fetch API)
  2. Затем эта информация об учетной записи может быть сохранена в состоянии приложения, возможно, с помощью Redux .

Приложение должно получать информацию об учетной записи после входа в систему или сервер должен автоматически отправлять эти данные клиенту? И является ли Redux подходящим инструментом для хранения такого рода данных, или это то, что должен обрабатывать localStorage?

Комментарии:

1. Это совершенно произвольно в зависимости от используемых вами сервисов и личных предпочтений.

Ответ №1:

Выборка данных происходит на стороне клиента (React). Обычно вы отслеживаете, вошел ли пользователь в систему или нет в вашем локальном состоянии или повторно. Допустим, вы используете firebase в качестве серверной службы, тогда приведенный ниже метод (обычно его следует размещать внутри компонента, для которого требуется информация об аутентификации пользователя) автоматически отслеживает изменение статуса авторизации.

 firebase.auth().onAuthStateChanged(function(user) {
  if (user) {    // you can pass this info to local state or redux
    // User is signed in. 
  } else {
    // No user is signed in.
  }
});

https://firebase.google.com/docs/auth/web/manage-users

Один из способов решения вашего случая заключается в том, что после получения информации о пользователе из серверной части вы сохраняете ее в локальном состоянии или отправляете в action creator для сохранения в redux.

Ресурс: https://blog.logrocket.com/getting-started-react-redux-firebase /

Ответ №2:

Приложение должно получать информацию об учетной записи после входа в систему или сервер должен автоматически отправлять эти данные клиенту?

Да, приложение должно получить это после входа в систему.

является ли Redux подходящим инструментом для хранения такого рода данных, или это то, что должен обрабатывать localStorage?

Да, определенно Redux вместо localStorage или просто используйте глобальное управление состоянием react.