Firebaseと反応スナップショットで反応する（プレレンダリング）

Question

firebaseに新しいものがありますが、すべてのデータをfirebaseに置く前に、ちょっと単純なテスト反応コンポーネントを書きましたが、残念ながらサーバで動作させることができませんでしたSide Pre-Rendering。それは私にとってSEOのフレンドリーなものにすることは非常に重要です。私は解決策についてインターネット上で検索していますが、まだそれを理解できませんでした。

以下の簡単なコードはReact-Snapshotで初期状態を生成しますが、ページを開いて初期状態を表示して新しい状態に更新しますが、データを取得する初期状態オブジェクトを作成する必要がありますFirebaseから直接取得し、React-Snapshotで静的HTMLを生成します。

SEOによって

class FirebaseTestingComponent extends Component { 
constructor(){ 
    super(); 
    this.state = { 
    speed: 10 
    }; 

} 

componentWillMount(){ 
    const rootRef = firebase.database().ref().child('react'); 
    const speedRef = rootRef.child('speed'); 
    speedRef.on('value', snap => { 
    this.setState({ 
     speed: snap.val() 
    }); 
    }); 
} 


render(){ 
    return (
    <div> 
     <h1>{this.state.speed}</h1> 
    </div> 

); 

} 

}

Answer 1

優しいそれはWebSocketのようなものだ）私はあなたの代わりに、動的（ないSEOの専門家）の静的なコンテンツをしたいと仮定していますが.on使用する場合firebaseは（特に非同期的に実行、問題ではありません。もしあなたがそうするなら、この場合はマウントまたはマウントしません。
私の謙虚な提案は、ページをレンダリングする前にサーバーのfirebaseからフェッチして（FirebaseをサポートしているJavaとノードを確認してください）、フェッチした値で初期状態を設定すると、初期状態は火災基地からのものです。それでは、後で値を入力するために.on（）を使用することができます。