How to properly use passport-github for REST API authentication?

Question

I am building a vue.js client which needs to be authenticated through github oauth using an express server. It's easy to do this using server side rendering but REST API has been troublesome for me.

I have set the homepage url as "http://localhost:3000" where the server runs and I want the authorization callback url to be "http://localhost:8080" (which hosts the client). I am redirecting to "http://localhost:3000/auth/github/redirect" instead, and in its callback redirecting to "http://localhost:8080". The problem I am facing is that I am unable to send user data to the vuejs client through res.redirect. I am not sure if I am doing it the right way.

router.get("/github", passport.authenticate("github"));

router.get(
  "/github/redirect",
  passport.authenticate("github", { failureRedirect: "/login" }),
  (req, res) => {
    // res.send(req.user);
    res.redirect("http://localhost:8080/"); // req.user should be sent with this
  }
);

Answer 1

I have implemented the following approach as a work around :-

A route that returns the user details in a get request :

router.get("/check", (req, res) => {
if (req.user === undefined) {
  res.json({});
} else {
  res.json({
    user: req.user
  });
}
});

The client app hits this api right after redirection along with some necessary headers :

checkIfLoggedIn() {
  const url = `${API_ROOT}auth/check/`;
  return axios(url, {
    headers: { "Content-Type": "application/json" },
    withCredentials: true
  });
}

To enable credentials, we have to pass the following options while configuring cors :

var corsOption = {
  origin: true,
  credentials: true
};

app.use(cors(corsOption));