javascript - サーバー側のレンダリングで未定義の React Context

Question

シンプルなアプリのサーバー側レンダリング中にデータを渡そうとしています。

サーバーとクライアントの両方にこのデータプロバイダーがあり、グローバル変数を使用して初期状態をクライアントに挿入します。

import React, { Component } from 'react';

export default class SsrDataProvider extends Component {
  constructor(props) {
    super(props);
    this.state = { data: window.__INITIAL_STATE__ };
  }

  getChildContext() {
    return { data: this.state.data };
  }

  render() {
    return this.props.children;
  }
}

SsrDataProvider.propTypes = {
  children: React.PropTypes.object,
};

SsrDataProvider.childContextTypes = {
  data: React.PropTypes.object,
};

サーバーでは、ウィンドウ。INITIAL_STATEは、prop を介して渡された実際のデータに置き換えられます。

renderToString(<SsrDataProvider {...renderProps} data={data} />)

データプロバイダーは、子の代わりにルーターコンテキストをレンダリングします...

render() {
  return <RouterContext {...this.props} />;
}

問題は、サーバーのレンダリング中にコンテキストが定義されていないことです。それはまったく渡されなかったようなものです。次に、javascript バンドルがクライアントに到着すると、ウィンドウが使用されます。INITIAL_STATE変数を変更し、サーバーが中断したところから再開します。それは機能しますが、サーバー側のレンダリングは行わない方がよいでしょう。足りないものはありますか？それとも renderToString() がコンテキストをサポートしていないのでしょうか?