Доступ к файлам cookie из React SSR - PullRequest
0 голосов
/ 25 февраля 2019

Вот простая вещь.Реакция пути перенаправления маршрутизации зависит от значения в файлах cookie, поэтому как мне обработать его на стороне сервера?

render() {
  something = cookie.get('my-something-value') || 'default '; // always takes defualt value beacuse cookies are not available 
  return (
    <Switch>
      <Route />
      <Route />
      <Redirect to={`/something/${val}`}/>
    </Switch>
  )
}

Так что * метод renderToString на сервере анализирует элементы в строку, игнорируя это условие, и я получаю неправильное перенаправление дажехотя у меня установлено печенье

1 Ответ

0 голосов
/ 27 февраля 2019

Я столкнулся с подобной проблемой.Это было решено с помощью:

  • Передача дополнительной реквизита (здесь: serverCookie), содержащего куки, вашим маршрутам в renderToString.
  • В методе рендеринга (где вы определили все маршруты / редирект));проверьте, вызывается ли он на клиенте или сервере.Если это на стороне сервера, используйте новую опору (здесь: serverCookie), содержащую cookie, в противном случае используйте cookie.get со стороны клиента.
  • Дополнительная опора (здесь: serverCookie) недоступна, когда маршрутыотображается на стороне клиента.

Мой renderToString на стороне сервера выглядел примерно так:

renderToString(
  <Provider store={store}>
    <StaticRouter ...>
      <MyRoutes ... serverCookie={req.headers.cookie} />
    </StaticRouter>
  </Provider>
)

Файл MyRoutes выглядел так:

render(){
  const cookie = isServerSide
    ? this.props.serverCookie
    : cookie.get('my-something-value')
  const path = cookie ? "/pathC" : "/pathD"
  return (
    <Switch>
        <Route
          path="/pathA"
          component={ComponentA}
        />
        <Route
          path="/pathB"
          component={ComponentA}
        />
        <Redirect to={path} />
      ...
    </Switch>
  )
}

Примечание:Вам нужно будет правильно проанализировать файлы cookie с помощью некоторого анализатора файлов cookie.

Надеюсь, это поможет и решит вашу проблему.Возврат для любых сомнений / разъяснений.

...