클라이언트 서버에서 소셜 로그인

현재 상황

클라이언트와 서버를 각자 다른 도메인에 배포했습니다.

소셜 로그인은 passport 모듈과 session을 사용했습니다.

서버에서 소셜 로그인이 성공해도 클라이언트에는 세션 쿠키가 전달되지 않습니다.

클라이언트

axios get 요청을 보내면 cors 에러가 떠서 a 태그를 사용했습니다.

<a href="http://서버ip/auth/github">깃 헙 로그인<a/>

서버

아래의 코드는 강의의 내용과 동일합니다. passport 모듈을 활용해 소셜 로그인을 구현했습니다.

import express from "express";
import passport from "passport";
import { isLoggedIn, isNotLoggedIn } from "../middlewares/authMiddleware.js";

const router = express.Router();

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

router.get(
  "/github/callback",
  passport.authenticate("github", {
    failureRedirect: "/",
  }),
  (req, res) => {
    res.redirect(`http://localhost:3000`);
  }
);

router.get("/logout", isLoggedIn, (req, res) => {
  req.logout();
  req.session.destroy();
  res.json({ message: "logout" });
});

export default router;

소셜 로그인에 성공하면 클라이언트 서버의 메인 페이지로 redirect 시키고 있습니다.

문의

서버에서 소셜 로그인 성공시 클라이언트 서버에도 session 쿠키를 전달하고 싶습니다.

두 개의 다른 서버에서 소셜 로그인을 어떻게 구현해야될지 모르겠습니다.

router.get(
  "/github/callback",
  passport.authenticate("github", {
    failureRedirect: "/",
  }),
  (req, res) => {
    console.log(req.headers.cookie);
    res.redirect(`http://localhost:3000?cookie=${req.headers.cookie}`);
  }
);