Как определить, что я на сервере и клиенте в Next.js

Я использую клиентский экспресс-сервер с Next.js. Он работает внутри контейнера. Я делаю http-запрос с isomorphic-fetch для получения данных для моего рендеринга. Я бы хотел сделать localhost при работе на сервере и mysite.com при работе на клиенте. Не уверен, что лучший способ это сделать. Я могу сделать это взломанно, выполнив const isServer = typeof window === 'undefined' но это выглядит довольно плохо.

Ответы

Ответ 1

Вы можете использовать process.browser для различения серверной среды (NodeJS) и среды клиента (браузера).

process.browser является true на клиенте и undefined на сервере.

Ответ 2

Еще одно замечание заключается в том, что componentDidMount() всегда вызывается в браузере. Я часто загружаю начальный набор данных (seo content в getInitialProps(), затем загружаю больше данных глубины в метод componentDidMount().

Ответ 3

Так как мне не нравится зависеть от странных сторонних вещей для этого поведения (хотя process.browser, кажется, прибывает из Webpack), я думаю, что предпочтительный способ проверить это на наличие appContext.ctx.req следующим образом:

async getInitialProps (appContext) {

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

Источник: https://github.com/zeit/next.js/issues/2946