Next.jsでカスタマーエクスプレスサーバーを使用しています。コンテナ内で実行されています。レンダリング用のデータを取得するために、isomorphic-fetch
を使用してhttpリクエストを実行しています。サーバーで実行しているときにlocalhost
を実行し、クライアントで実行しているときにmysite.com
を実行したいと思います。これを達成するための最良の方法がわからない。 const isServer = typeof window === 'undefined'
を実行することでハックできますが、それはかなり悪いようです。
process.browser
を使用して、サーバー環境(NodeJS)とクライアント環境(ブラウザー)を区別できます。
process.browser
は、クライアントではtrue
、サーバーではundefined
です。
もう1つの注意点は、ブラウザーでcomponentDidMount()
が常に呼び出されることです。私はしばしば初期データセットをロードします(getInitialProps()
のseoコンテンツ、そしてcomponentDidMount()
メソッドの詳細なデータをロードします。
私はこの動作を奇妙なサードパーティのものに依存するのが好きではないので(process.browser
はWebpack)から来ているようです。チェックするための好ましい方法は、appContext.ctx.req
このような:
async getInitialProps (appContext) {
if (appContext.ctx.req) // server?
{
//server stuff
}
else {
// client stuff
}
}