Настойчивость состояния Redux с базой данных

Из обсуждения здесь кажется, что состояние редукторов Redux должно сохраняться в базе данных.

Как в этом случае работает пользовательская аутентификация?

Не будет ли создан новый объект состояния для замены предыдущего состояния в базе данных для каждого пользователя (и состояния приложения), созданного и отредактированного?

Будет ли использовать все эти данные на передней панели и постоянно обновлять состояние в базе данных?

Изменить: Я создал пример проекта Redux auth, который также является примером универсального Redux и обновление в реальном времени с помощью Redux, Socket.io и RethinkDB.

Ответ 1

Из обсуждения здесь кажется, что состояние редукторов Redux должно сохраняться в базе данных.

Чтобы сохранить состояние или нет, скорее всего это не проблема Redux. Это больше подходит к логике приложений.

Если что-то происходит в приложении, например, загрузка данных на сервер, очевидно, вам нужно сохранить состояние (или срез состояния на сервер).

Так как сетевые вызовы асинхронны, но Redux синхронно - вам нужно ввести дополнительное промежуточное ПО, redux-thunk или redux-promise.

В качестве регистрационного примера вам, вероятно, понадобятся эти действия,

export function creatingAccount() {
  return { type: 'CREATING_ACCOUNT' };
}

export function accountCreated(account) {
  return { type: 'ACCOUNT_CREATED', payload: account };
}

export function accountCreatingFailed(error) {
  return { type: 'ACCOUNT_CREATING_FAILED', payload: error };
}

export function createAccount(data, redirectParam) {
  return (dispatch) => {
    dispatch(creatingAccount());

    const url = config.apiUrl + '/auth/signup';

    fetch(url).post({ body: data })
      .then(account => {
        dispatch(accountCreated(account));
      })
      .catch(err => {
        dispatch(accountCreatingFailed(err));
      });
  };
}

Некоторая часть состояния, например. пользовательский объект после авторизации может быть сохранен в localStore и повторно увлажнен при следующем запуске приложения.

Ответ 2

Это действительные проблемы. Использование localStorage для сохранения состояния в интерфейсе может быть лучшей стратегией. Вы можете реализовать это с помощью промежуточного программного обеспечения, например:

import {createStore, compose, applyMiddleware} from 'redux';

const localStorageMiddleware = ({getState}) => {
  return (next) => (action) => {
    const result = next(action);
    localStorage.setItem('applicationState', JSON.stringify(
      getState()
    ));
    return result;
  };
};

const store = compose(
  applyMiddleware(
    localStorageMiddleware
  )
)(createStore)(
  reducer,
  JSON.parse(localStorage.getItem('applicationState'))
)

Если вы беспокоитесь о том, что противник обращается к ноутбуку пользователя и крадет учетные данные из него, вы можете сохранить состояние бэкэнд, когда пользователь покинет страницу (Navigator.sendBeacon() может быть здесь полезен) и сохраните его в сеансе.