首页 > 解决方案 > 将 SameSite 属性添加到 Passport.js 会话 Cookie

问题描述

我正在使用带有 OAuth2Strategy 策略的 Passport.js 对 OIDC 服务进行身份验证。应用程序向需要 Passport 设置的 connect.sid cookie 的服务发出一些跨域请求。Chrome 承诺将停止支持这些请求,除非 cookie 的 SameSite 属性设置为“Lax”。

我不知道该怎么做,因为 cookie 的设置是 Passport 内部的。有什么建议么?下面是位于给 OIDC 服务的回调路由中的相关函数调用。

  passport.authenticate("oauth2", function (err, user, info) {
    if (err) {
      req.flash('error', err);
      res.redirect('/login_error/');
    }
    else if (!user) {
      req.flash('error', 'Unable to locate user account.');
      res.redirect('/login_error/');
    }
    else {
      req.logIn(user, (err) => {
        if (err) { return next(err); }
        return res.redirect('/user_profile/);
      });
    }
  })(req, res, next);

标签: javascriptexpresspassport.js

解决方案


答:尝试使用href。或者在客户端应用程序上设置代理到服务器应用程序。

我也遇到过同样的问题。进行了广泛的研究。总结如下。

用例和技术栈:使用 Passport.js 通过 React 和 Express 实现 Google OAuth 身份验证。在快递中使用 CORS。此外,在 Express 中设置一个中间件以添加Access-Control-Allow-Origin, Access-Control-Allow-Headers and Access-Control-Allow-Credentials到每个响应中。仍然没有工作。

解决方案:似乎唯一可行的解​​决方案是使用前端的 href 来调用身份验证 URL(例如 /auth/google)。或者从客户端设置代理以将请求重定向到服务器(尚未尝试或测试过)。

长期解决方案: Passport.js 需要将 same-site=none 添加到它发送给客户端的 cookie 中,以便 chrome 允许使用 fetch 重定向请求。

核心问题:由于重定向问题,axios 无法工作。OAuth API 需要在认证后重定向到客户端 URL。由于 Chrome same-site=lax cookie 问题,Fetch 无法正常工作。XHR 也面临着问题。也许是重定向、cookie 和 CORS 挑战的组合。

PS还了解到在 Express 中设置 res.header('Access-Control-Allow-Origin', '*') 不适用于 axios。axios 似乎需要一个特定的域


推荐阅读