同构应用程序中的用户配置文件

Question

我目前正在使用 React、Redux、Express 和 Node.js 向网站添加登录以及与登录相关的一组高级功能。对于实际登录，我使用的是 Passport，以及 Facebook、Google 和 Twitter 策略。获得所需令牌后，它会发送到 AWS Cognito 联合身份，以便为用户获取同步数据。网站上的数据也会在需要时同步回 Cognito。

用户登录后，我可以在 Node 服务器上构建一个完整的用户配置文件，但是现在呢？

// server.jsx
// imports
.............

// variables
.............

var userProfile;
// logging the user with Passport and adding it to the profile
.............

app.use((req, res) => {
    // I can do whatever I want with the profile here
    .............

    // handling the request and creating an initial state ..
    .............
}

在过去，使用会话变量 (Java/C#) 或 cookie (JS) 可以很容易地解决这个问题，但在同构应用程序中就不是那么简单了。假设用户在登录后通过路由访问 profile.jsx： cookie（例如通过 client-sessions 设置）仅在 jsx 文件在客户端上运行时可用；每当它被服务器渲染时，它都无法访问。

即使在使用同构cookie 或通用cookie 之类的东西时，似乎也需要自定义代码，这几乎违背了同构应用程序的目的。我也想过使用 Redux，但是 Redux 似乎在 Node 上只有一个初始状态，这并没有多大帮助。

// Profile.jsx
import React , { Component } from 'react';
import Cookies from 'universal-cookie';

class Profile extends Component {
    // Stuff
    .............

    render() {
        // Would love to be able to access to the profile without custom code like this
        if (typeof window != 'undefined' && window.document) {
            const cookies = new Cookies();
            console.log(cookies.get('user'));
        }
    }

那么，是否有一种流畅的方式来处理您想要随时访问的用户配置文件或其他变量，而无需为每个场景编写大量自定义代码？似乎大多数教程和示例仅在服务器或客户端上处理此类事情，在这种特殊情况下需要重新编写网站。

在大多数情况下，同构应用程序是相当简单的，但是当引入身份验证、配置文件等时，复杂性确实突飞猛进，所以我非常感谢任何关于此事的反馈。

Answer 1

我认为这里的常见情况是添加一个身份验证步骤，然后将成功的身份验证令牌存储为 cookie 或在您的应用状态中，您在后续查询中提供回配置文件 API。

从您的 API 返回的任何数据也可以添加到您的 Redux 存储中，以便您始终可以访问它，并在您需要持久更改或想要强制更新当前状态数据时进行更新。