Unable to set cookie in cross-domain environment using Express cookie-session and passportjs GitHub OAuth2

33 Views Asked by At

I have an app with react frontend and express backend implementing passport.js GitHub OAuth2 + cookie-session workflow.

The res.on("close") listener recorded that while in development with the frontend and the backend on different ports of localhost, the backend was able to send Set-Cookie header to the client as expected. but once I pushed the app up to the web (frontend was hosted on Vercel, backend was containerized with docker and hosted on render; both address bars showinghttps),the backend did not send the Set-Cookie header to the front at all.  The followings are related code:

GitHub OAuth callback:

router.get("/github/callback", (req, res, next) => {
  res.on("close", function () {
    console.log("====== close event =======");
    console.log("res.headers===>");
    console.log(res.getHeaders());
    console.log("====== close event =======");
  });

  passport.authenticate("github", function (err, user, info, status) {
    if (err) {
      return next(err);
    }
    if (!user) {
      console.log("no user");
      return res.redirect(process.env.CLIENT_URL);
    }
    req.logIn(user, function (err) {
      if (err) {
        return next(err);
      }
      return res.status(302).redirect(process.env.CLIENT_URL || "http://localhost:5173");
    });

  })(req, res, next);
});

Setup of the cookieSession middleware AND recorded GitHub OAuth callback response headers in development:1

Setup of the cookieSession middleware for production:

app.use(
  cookieSession({
    name: "MTsession",
    sameSite: "none",
    secure: true,
    keys: ["somekeys"],
    maxAge: 24 * 60 * 60 * 1000,
  })
);

Recorded GitHub OAuth callback response headers in production:2

I'm wondering if anyone knows why this is happening and how to fix this.

0

There are 0 best solutions below