Как в React организовать инициализацию данных пользователя?

Question

[Артем]

Где и как лучше всего производить первичную инициализацию приложения, имея на клиенте токен пользователя.
При открытии страницы хочу проверять валидность токена, а после этого пускать его по запрошенному URI.
Сейчас компонент App выглядит следующим образом:

import store from '../store'

class Application extends React.PureComponent {
  constructor (props) {
    super(props)

    this.state = {
      initialized: false
    }
  }

  componentDidMount () {
    // verifyToken - action, в котором происходит запрос к серверу
    store.dispatch(verifyToken()).then(() => {
      this.setState({ initialized: true })
    })
  }

  renderPreloader () {
    return <div className='app-preloader'><Spinner /></div>
  }

  renderApp () {
    return <BrowserRouter>
      <Provider store={store}>
        <Switch>
          // SecurityRoute - компонент, проверяющий в store наличие у пользователя прав на просмотр страницы. Если такого права нет - редиректит
          <SecurityRoute field='username' deny path='/login' component={PageAuth} />
          <Route component={PageMain} />
        </Switch>
      </Provider>
    </BrowserRouter>
  }

  render () {
    return this.state.initialized ? this.renderApp() : this.renderPreloader()
  }
}

Answer 1

[Антон Спирин]

store.dispatch(init());  // тут

const root = (
  <Provider store={store}>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </Provider>
);

ReactDom.render(root, document.getElementById('root'));

Так запросы проверки валидности и получения данных пользователя будут инициированы до монтирования приложения.