web-dev-qa-db-ja.com

Next.jsでサーバー対クライアントにいることを検出するにはどうすればよいですか

Next.jsでカスタマーエクスプレスサーバーを使用しています。コンテナ内で実行されています。レンダリング用のデータを取得するために、isomorphic-fetchを使用してhttpリクエストを実行しています。サーバーで実行しているときにlocalhostを実行し、クライアントで実行しているときにmysite.comを実行したいと思います。これを達成するための最良の方法がわからない。 const isServer = typeof window === 'undefined'を実行することでハックできますが、それはかなり悪いようです。

15
Dave Stein

process.browserを使用して、サーバー環境(NodeJS)とクライアント環境(ブラウザー)を区別できます。

process.browserは、クライアントではtrue、サーバーではundefinedです。

25
saimeunt

もう1つの注意点は、ブラウザーでcomponentDidMount()が常に呼び出されることです。私はしばしば初期データセットをロードします(getInitialProps()のseoコンテンツ、そしてcomponentDidMount()メソッドの詳細なデータをロードします。

1
ForrestLyman

私はこの動作を奇妙なサードパーティのものに依存するのが好きではないので(process.browserWebpack)から来ているようです。チェックするための好ましい方法は、appContext.ctx.req このような:

async getInitialProps (appContext) {

    if (appContext.ctx.req) // server? 
    {
        //server stuff
    }
    else {
        // client stuff
    }
}

ソース: https://github.com/zeit/next.js/issues/2946

0
Gezim