카카오 로그인

1. 전체 구조 요약

1. GET /kakao
   • 사용자가 카카오 로그인 버튼을 클릭하면, 이 라우트를 통해 카카오 OAuth 인증 페이지로 이동합니다.
   • 내부적으로 passport.authenticate("kakao")가 동작하면서 카카오 로그인 창을 띄웁니다.
2. GET /kakao/callback
   • 카카오 인증이 완료되면 카카오 측에서 이 콜백 라우트로 코드를 보내줍니다.
   • passport.authenticate("kakao", { failureRedirect: "/login-fail" })를 통해 인증을 진행합니다.
     • 인증에 실패하면 /login-fail로 리다이렉트
     • 성공하면 다음 미들웨어(콜백 함수)가 실행
3. 콜백 함수
   • req.user 안에 passport 전략에서 반환된 사용자 정보가 담깁니다.
   • 여기서 req.user.token과 req.user.isFirstLogin을 꺼내 프론트엔드에 전달하기 위해 리다이렉트 URL을 생성합니다.
   • FRONTEND_URL(환경변수 또는 기본값)로 accessToken과 isFirstLogin을 쿼리스트링으로 붙여서 리다이렉트합니다.
4. GET /logout
   • 로그아웃 시 쿠키에 저장된 token을 제거(res.clearCookie("token"))하고, JSON으로 로그아웃 메시지를 응답합니다.

---

2. 코드 상세 설명

// ✅ 카카오 로그인 요청
router.get("/kakao", passport.authenticate("kakao"));

• 카카오 인증 시작
  • 사용자가 이 엔드포인트로 접근하면, Passport의 KakaoStrategy가 동작하여 카카오 로그인 화면으로 리다이렉트됩니다.

router.get(
  "/kakao/callback",
  passport.authenticate("kakao", { failureRedirect: "/login-fail" }),
  (req, res) => {
    const { token, isFirstLogin } = req.user;

    // ✅ 프론트엔드 URL
    const FRONTEND_URL = process.env.FRONTEND_URL || "https://colunch-phi.vercel.app";

    // ✅ 프론트엔드로 accessToken과 isFirstLogin을 URL로 전달
    res.redirect(`${FRONTEND_URL}?accessToken=${token}&isFirstLogin=${isFirstLogin}`);
  }
);

1. 카카오 인증 콜백
   • 카카오에서 인증을 마친 뒤, 이 경로로 돌아옵니다.
   • passport.authenticate("kakao", { failureRedirect: "/login-fail" })에서 카카오 인증 정보를 확인하고, 실패 시 /login-fail로 이동시킵니다.
   • 성공 시 다음 콜백 함수로 넘어와 req.user 객체를 사용할 수 있습니다.
2. req.user
   • Passport의 KakaoStrategy가 정상적으로 완료되면, done(null, user) 형태로 반환된 객체가 req.user에 담깁니다.
   • 이 예시에서는 user 객체에 token과 isFirstLogin을 포함하도록 Passport 설정에서 처리한 것으로 보입니다.
     • 예: KakaoStrategy 콜백 함수에서 user.token = jwt.sign(...), user.isFirstLogin = ... 식으로 설정했을 가능성이 높습니다.
3. 프론트엔드로 리다이렉트
   • 인증 성공 후, res.redirect를 통해 프론트엔드 주소로 이동합니다.
   • 이때 쿼리스트링(?accessToken=${token}&isFirstLogin=${isFirstLogin})에 토큰과 isFirstLogin 정보를 포함하여 전달합니다.
   • 프론트엔드에서는 해당 값을 받아서, 로컬 스토리지나 쿠키 등에 저장하고 이후 API 요청 시 헤더에 토큰을 첨부하는 방식으로 사용할 수 있습니다.

// ✅ 로그아웃
router.get("/logout", (req, res) => {
  res.clearCookie("token");
  res.json({ message: "Logged out" });
});

• 로그아웃
  • res.clearCookie("token")로 token 쿠키를 제거합니다.
  • 일반적으로 카카오 자체 세션이나 Access Token은 서버 측에서 완전히 만료시키지 않지만, 사용자 측면에서는 더 이상 인증이 유효하지 않도록 쿠키나 로컬 스토리지를 제거하는 방식으로 처리합니다.

---

3. Passport와 KakaoStrategy 개념

• Passport:
  Node.js 환경에서 인증(로그인) 로직을 간단히 구현할 수 있도록 해주는 미들웨어 라이브러리입니다.
• KakaoStrategy:
  Passport가 제공하는 여러 OAuth 전략 중 하나로, 카카오 로그인을 손쉽게 구현할 수 있게 해줍니다.
  • passport.use(new KakaoStrategy({ ... }, async (accessToken, refreshToken, profile, done) => { ... })) 형태로 설정합니다.
  • 콜백 함수 내에서 DB에서 사용자 정보를 찾거나, 없으면 새로 생성한 뒤 done(null, user)를 호출합니다.
  • 이 때 user 객체에 JWT 토큰이나 isFirstLogin 등의 값을 추가해주면, 최종적으로 req.user에 담깁니다.

---

4. 보완 및 확장 포인트

1. 토큰 전달 방식
   • 현재는 쿼리스트링으로 토큰을 프론트엔드에 넘기고 있습니다.
   • 민감한 토큰 정보를 URL로 노출하는 것은 안전하지 않을 수 있으므로,
   • HTTP-Only 쿠키에 담아서 전달하거나, 서버에서 직접 응답(JSON)으로 넘기는 방식도 고려할 수 있습니다.(이걸 시도했지만 계속 에러 쿠키에 담아있는 정보를 프론트에서 꺼내지 못한다 !)
2. 로그아웃 처리
   • 백엔드와 프론트엔드 양쪽에서 토큰을 제거해야 완전히 로그아웃됩니다.
   • 만약 서버가 세션을 사용한다면, 세션도 파기해야 합니다(req.session.destroy(...) 등).
3. 회원가입 로직
   • 카카오 로그인 후 처음 가입하는 사용자라면 DB에 정보를 저장해야 합니다.
   • 예: User.findOne({ kakaoId: profile.id })로 조회 후, 없으면 새로 생성.
   • isFirstLogin이 true라면 추가 프로필 정보를 입력시키고, 이후 false로 업데이트하는 흐름도 가능.
4. 카카오 API 사용
   • 필요하다면 카카오 API(사용자 정보 조회, 카카오톡 메시지 전송 등)를 accessToken을 이용해 호출할 수 있습니다.
   • passport-kakao에서 반환해주는 accessToken, refreshToken을 사용해 카카오 Open API와 연동할 수도 있습니다.
5. 오류 처리
   • failureRedirect 외에, 에러 상황을 좀 더 세분화해서 처리할 수 있습니다.
   • 예: DB 조회 실패, 토큰 생성 실패 등 각각의 오류 상황을 클라이언트에 알리도록 구성할 수 있습니다.

---

5. 결론

이 auth.js 파일은 카카오 OAuth 인증을 구현하는 핵심 로직으로,

1. 카카오 인증 페이지로 이동 →
2. 카카오에서 콜백 →
3. Passport 인증 →
4. JWT 토큰 + isFirstLogin 정보를 프론트엔드에 전달
   의 순서를 거칩니다.

\