Экспресс не знает сессии по первому запросу из-за рендеринга на стороне сервера - PullRequest
0 голосов
/ 17 января 2019

expess-session хранит куки на клиенте.

Однако, поскольку я использую рендеринг на стороне сервера (с next.js), первый запрос не содержит информации о клиенте, потому что клиент еще не существует в браузере.

Я пишу неловкий код для учета этого случая, ожидаю загрузки компонента, затем отправляю запрос на аутентификацию и т. Д., И это не только выглядит как плохой шаблон, но и не является идеальным для пользователя так как есть страница флеш.

import * as React from 'react'
import {
    getUrl
} from 'Root/helpers/fetch-helpers'
import Router from 'next/router'

const securePage = Page => class SecurePage extends React.Component {

    static async getInitialProps(ctx) {
        let authenticated = false;
        try {
            /* either in server or from client we fetch the auth status */
            const jsonRes = await getUrl(`/api/employers/check-auth`);
            if (jsonRes.authenticated) {
                authenticated = true;
            } else {
                console.warn("Not authenticated to view the page");
            }
        } catch (err) {
            console.error("API Auth callback error: ", err);
        }

        let language;
        if (ctx.req) {
            /* REDIRECT in case of un authenticated access */
            if (!authenticated) {
                //    ctx.res.writeHead(302, {
                //        Location: '/employers'
                //    }) 
                //    ctx.res.end()
            }
            language = ctx.req.session.language;
        } else {
            if (!authenticated) {
                Router.push("/employers");
            }
            language = localStorage.getItem('language');
        }
        let props = {}
        if (Page.getInitialProps) {
            const pageProps = await Page.getInitialProps(ctx);
            props = { ...pageProps,
                language
            }
        }
        return props;
    }

    async componentDidMount() {
        let {
            language
        } = this.props;
        if (language) {
            /* if we were able to fetch the language, set it here */
            localStorage.setItem('language', language);
            this.state = {};
        } else {
            language = localStorage.getItem('language');
            this.state = { language };
        }
        const jsonRes = await getUrl(`/api/employers/check-auth`);
        if (!jsonRes.authenticated) {
            Router.push("/employers");
        }
    }

    render() {
        console.log("pre-render page props ", this.props);
        if (this.state && this.state.language) {
            return <Page { ...this.props } language={this.state.language} /> 
        } else {
            return <Page { ...this.props } language={this.props.language} /> 
        }
    }
}

export default securePage

Есть ли способ, которым я мог бы вызвать правильный объект экспресс-сеанса при первом запросе, еще до того, как клиент был в браузере пользователя. Есть ли лучший модуль (или метод?), Который учитывал бы этот шаблон?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...