Question

我正在使用使用Passport进行身份验证的React Starter Kit制作应用。我现在正在尝试访问前端的req.user对象，但是我将req.user对象传递到React / ES6环境时遇到了麻烦。

我尝试将对象作为prop和context传递，但无济于事。此时，我决定创建一个API端点，我可以将req.user的值作为JSON返回，但req.user作为undefined返回，尽管它在get('*')下正常工作

这是我做的GET调用，即返回undefined：

server.get('/user', (req, res) => {
  console.info('user: ', req.user);
});

虽然

server.get('*', async (req, res, next) => {
  console.info('*: ', req.user);
  // ... the rest of the React Starter Kit rendering code

确实会为req.user返回一个对象，这让我很困惑。护照会议是否仅限于某些网址或其他内容？

中间件：

    server.use(express.static(path.join(__dirname, 'public')));
    server.use(cookieParser());
    server.use(session({
      secret: 'keyboard cat',
      cookie: { httpOnly: false },
      resave: true,
      saveUninitialized: true,
    }));

    server.use(passport.initialize());
    server.use(passport.session());

序列化/反序列化就像它们一样简单：

    passport.serializeUser((user, done) => {
      console.log('serializeUser');
      done(null, user);
    });

    passport.deserializeUser((obj, done) => {
      console.log('deserializeUser');
      done(null, obj);
    });

我知道有关于req.user未定义的类似SO线程，但似乎没有一个我的情况，它有时根据请求的位置有时未定义。感谢阅读和任何建议。干杯！

编辑：这是认证流程

    [initial app load with fresh server instance...]
    in (*) passport FALSE
    indexPage mounting...
    in (/user) passport FALSE
    [click login button and successfully login]
    serializeUser
    deserializeUser
    in (*) passport is TRUE
    indexPage mounting...
    in (/user) passport FALSE

我做了一些进一步的测试，并在使用Chrome控制台触发API调用时发现了一些有趣的内容。我正在使用fetch来执行此操作 - 我执行fetch('/user')然后使用componentDidMount方法记录响应。现在，当我在Chrome控制台fetch(/*)中执行此操作时，终端控制台会再次记录in (*) passport is false。

所以问题似乎是护照在初始渲染后完全消失了。 Cookie可能存在问题吗？我将进一步调查，看看我能找到什么。

Answer 1

使用fetch()时，与XMLHttpRequest()非常相似，您需要明确告诉浏览器需要发送任何凭据（例如会话cookie，Passport需要哪些来识别活动会话）以及请求：

fetch('/user', { credentials : 'same-origin' }).then(...);

您可以使用的各种值都记录在案here。

在React（ES6）中访问Passport的req.user？ API调用将req.user返回为undefined

1 个答案: