소셜 로그인Provider에 대해,
웹사이트나 앱에서 별도의 회원가입 없이 기존의 소셜 계정을 사용하여 로그인할 수 있게 하는 기능이야.
🔍 소셜 로그인 Provider의 개념
- 사용자(User) → 로그인 버튼 클릭
- 웹사이트(Client) → 해당 소셜 로그인 Provider로 인증 요청
- 소셜 로그인 Provider(Google, Facebook 등) → 사용자의 정보를 확인한 후, 액세스 토큰(access token) 발급
- 웹사이트(Client) → 발급된 토큰을 받아 사용자 인증을 완료하고, 로그인 처리
👉 소셜 로그인 Provider는 패스트푸드점의 키오스크 같은 역할이야!
- 직접 주문(회원가입)하지 않고, 기존 계정(카드)로 바로 결제(로그인) 가능
- 여러 브랜드(구글, 페이스북 등)를 지원
- 인증이 끝나면 음식(로그인 정보)이 제공됨
🔍 소셜 로그인 Provider의 핵심 개념
- OAuth 2.0 → 로그인 과정에서 토큰(Token) 을 이용한 인증 방식
- Access Token → 로그인 후 발급되는 사용자 인증 정보
- Refresh Token → Access Token이 만료되면 재발급하는 역할
- Redirect URI → 로그인 후 사용자를 다시 보낼 웹사이트 주소
- Scope(권한 요청) → 로그인 시, 사용자의 어떤 정보를 가져올지 결정
🔍 소셜 로그인 Provider의 동작 방식
(예) 구글 로그인, NextAuth 사용
- 구글 로그인 버튼 클릭
- OAuth 2.0 인증 요청 → 사용자가 로그인 허용하면, Google이 Access Token을 발급
- 발급된 Access Token을 서버로 전송
- 서버에서 토큰을 검증 후, 사용자 로그인 처리
- 로그인 완료 후, 홈페이지로 리디렉트
🔍 NextAuth에서 Provider 설정 예제
import NextAuth from 'next-auth';
import GoogleProvider from 'next-auth/providers/google';
export default NextAuth({
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_CLIENT_ID!,
clientSecret: process.env.GOOGLE_CLIENT_SECRET!,
}),
],
callbacks: {
async session({ session, token }) {
session.user.id = token.sub;
return session;
},
},
});
✔️ clientId, clientSecret → 구글 콘솔에서 발급받은 키
✔️ callbacks.session → 로그인 후 세션 정보를 설정