💻 코딩 일기 : [Spring Security] 'OAuth2 네이버 로그인' 편

🔔 'OAuth2 네이버 로그인'에 대해서 알아보자!

💟 OAuth2(Open Authorization)

• 네이버, 카카오, 구글 등 플랫폼을 사용해서 로그인을 처리할 때 많이 사용합니다.
• 자신의 계정 정보를 웹페이지와 공유하지 않고 네이버, 카카오, 구글 등과 같은 애플리케이션에 의해 로그인을 할 수 있습니다.
• 접근 토큰을 발급반아 사용합니다.
• OAuth2는 인증/인가에 대한 권한을 다른 서버에서 처리합니다.

장점 :

• 다른 사이트에 가입할 때 번거롭지 않습니다.
• 보안이 좋습니다.

단점:

• 만약 모든 웹사이트가 네이버로 회원가입이 되어 있다면 네이버 계정이 해킹당하면 가입된 모든 웹사이트도 해킹될 위험이 있습니다. 하지만 네이버 계정의 비밀번호를 바꾼다던지 한다면 모든 웹사이트가 안전해집니다. 장단점이 섞여있습니다.

💟 네이버 로그인 구현하기

1 ~ 3 : 인증 처리 완료 (code)
4 ~ 5 : 네이버 정보에 접근 권환 부여 (Access Token)
웹페이지가 선재 대신 네이버에 접근이 가능해집니다.

#OAuth2 
spring.security.oauth2.client.registration.naver.client-id=[클라이언트ID]
spring.security.oauth2.client.registration.naver.client-secret=[클라이언트 secret]
spring.security.oauth2.client.registration.naver.scope=email, nickname
spring.security.oauth2.client.registration.naver.client-name=Naver
spring.security.oauth2.client.registration.naver.authorization-grant-type=authorization_code
spring.security.oauth2.client.registration.naver.redirect-uri=http://localhost:8080/login/oauth2/code/naver

# provider
spring.security.oauth2.client.provider.naver.authorization-uri=https://nid.naver.com/oauth2.0/authorize
spring.security.oauth2.client.provider.naver.token-uri=https://nid.naver.com/oauth2.0/token
spring.security.oauth2.client.provider.naver.user-info-uri=https://openapi.naver.com/v1/nid/me
spring.security.oauth2.client.provider.naver.user-name-attribute=response

• application.properties 파일 먼저 설정해줍니다. 네이버에서 로그인 api 애플리케이션 등록한 다음 클라이언트 ID와 클라이언트 secret 받아서 설정해줍니다.
  네이버 애플리케이션 등록

1. SecurityConfiguration 클래스에서 OAuth2 설정해줍니다.

@Configuration
@EnableMethodSecurity
@RequiredArgsConstructor
public class SecurityConfiguration {

    private final Oauth2MemberService oauth2MemberService;

    @Bean
    public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {

        http.csrf(csrf -> csrf.disable())
                .formLogin(login -> login.loginPage("/member/login"))
                .authorizeHttpRequests(authorize -> authorize
                        .anyRequest()
                        .permitAll()
                )
                // OAuth2 로그인 구성을 위한 설정 가져옴
                .oauth2Login(oauth2 -> oauth2
                        // 사용자 정보 엔드포인트에 대한 설정 추가
                        .userInfoEndpoint(infoEndpoint ->
                                // 사용자 서비스 구성(로그인 성공 후 사용자 정보 처리)
                                infoEndpoint.userService(oauth2MemberService)));
        return http.build();
    }

    @Bean
    public BCryptPasswordEncoder bCryptPasswordEncoder() {
        return new BCryptPasswordEncoder();
    }
}

• .csrf : CSRF 비활성하여 공격을 방지합니다.
• .formLogin : 로그인 페이지 따로 설정합니다.
• .authorizeHttpRequests : 모든 사람에게 HTTP 요청을 허용합니다. 모든 요청에 대한 권한을 부여합니다.
• .oauth2Login : OAuth2를 사용하여 로그인 기능을 제공합니다. 로그인 성공 후 사용자 정보를 처리합니다.

2. OAuth2MemberInfo 인터페이스

public interface OAuth2MemberInfo {
    String getEmail();
    String getProvider();
    String getProviderId();
    String getNickName();
}

• 네이버로부터 받은 사용자 정보를 처리할 수 있습니다. 네이버에서 제공하는 사용자 정보의 형식에 맞게 처리할 수 있습니다.

3. NaverMemberInfo 클래스 (OAuth2MemberInfo 구현)

@AllArgsConstructor
public class NaverMemberInfo implements OAuth2MemberInfo {

    private Map<String, Object> attributes;

    // naver OAuth2로부터 받은 사용자 정보 추출
    @Override
    public String getProviderId() {
        return (String) attributes.get("id");
    }

    @Override
    public String getNickName() {
        return (String) attributes.get("nickname");
    }

    @Override
    public String getEmail() {
        return (String) attributes.get("email");
    }

    @Override
    public String getProvider() {
        return "naver";
    }
}

• OAuth2MemberInfo 인터페이스를 구현하여 네이버로부터 받은 사용자 정보를 가지고 추출합니다.

• 네이버의 attributes에서 우리가 필요한 response의 형식이 Map으로 되어 있어 Map을 사용합니다.
  

• getXXXX() : 네이버로부터 받은 사용자 정보에서 키에 해당하는 값을 추출합니다.

• getProvider() : 정보를 제공하는 제공자를 반환합니다. 제공자는 naver입니다.

4. Oauth2MemberService 클래스(DefaultOAuth2UserService)

@Service
@RequiredArgsConstructor
public class Oauth2MemberService extends DefaultOAuth2UserService {

    private final MemberMapper mapper;

    @Override
    public OAuth2User loadUser(OAuth2UserRequest userRequest) throws OAuth2AuthenticationException {
        System.out.println("userRequest.getAccessToken().getTokenValue() = " + userRequest.getAccessToken().getTokenValue());
        System.out.println("userRequest.getClientRegistration() = " + userRequest.getClientRegistration());
        System.out.println("userRequest.getClientRegistration().getRegistrationId() = " + userRequest.getClientRegistration().getRegistrationId());

        OAuth2User oAuth2User = super.loadUser(userRequest); //네이버 사용자 정보 로드
        System.out.println("oAuth2User = " + oAuth2User.getAttributes());

        String platform = userRequest.getClientRegistration().getRegistrationId(); //로그인한 클라이언트의 등록 ID

        OAuth2MemberInfo response = null;
        if (platform.equals("naver")) {
            System.out.println("네이버 로그인 요청");
            response = new NaverMemberInfo((Map) oAuth2User.getAttributes().get("response")); //네이버에 있는 사용자 정보 추출
            System.out.println(response);
        }
        
        // DB에 저장
        Member member = mapper.selectByEmail(response.getEmail());
        if (member == null) {
            member = Member
                    .builder()
                    .email(response.getEmail())
                    .nickName(response.getNickName())
                    .password(userRequest.getAccessToken().getTokenValue())
                    .build();

            // 네이버에서 받은 이메일 조회 후 해당 이메일이 없는 경우 insert
            System.out.println("최초");
            mapper.insert(member);
        }

        return new CustomOauth2MemberDetails(member, oAuth2User.getAttributes());
    }
}

• DefaultOAuth2UserService를 상속받아 loadUser를 구현합니다.
• Form을 사용한 로그인은 loadUserByUsername 메서드를 사용하고 OAuth를 사용한 로그인은 loadUser 메서드를 사용하여 로그인 이후 처리를 위한 메서드를 호출합니다.
• super.loadUser(userRequest) : OAuth2 클라이언트로부터 사용자 정보를 가져옵니다.
• platform : 클라이언트의 등록 ID를 가져와 제공자를 식별합니다. 플랫폼마다 ID가 다릅니다.
• 등록 ID가 naver인 경우에 네이버에서 제공하는 사용자 정보, 즉 NaverMemberInfo 클래스의 생성자에서는 response라는 키에 해당하는 값을 Map으로 변환하여 response 객체에 저장합니다.
• 사용자 정보를 DB에 조회하며 존재하지 않는다면 DB에 저장 해줍니다.

5. CustomOauth2UserDetails 클래스 (UserDetails, OAuth2User 인터페이스 구현)

public class CustomOauth2MemberDetails implements UserDetails, OAuth2User {

    private Member member;
    private Map<String, Object> attributes; // 네이버에서 받아온 정보

    public CustomOauth2MemberDetails(Member member, Map<String, Object> attributes) {
        this.member = member;
        this.attributes = attributes;
    }

    public CustomOauth2MemberDetails(Member member) {
        this.member = member;
    }

    @Override
    public String getName() {
        return null;
    }

    @Override
    public String getPassword() {
        return member.getPassword();
    }

    @Override
    public String getUsername() {
        return member.getNickName();
    }

    @Override
    public Map<String, Object> getAttributes() {
        return attributes;
    }

    @Override
    public Collection<? extends GrantedAuthority> getAuthorities() {
        return List.of();
    }


    @Override
    public boolean isAccountNonExpired() {
        return true;
    }

    @Override
    public boolean isAccountNonLocked() {
        return true;
    }

    @Override
    public boolean isCredentialsNonExpired() {
        return true;
    }

    @Override
    public boolean isEnabled() {
        return true;
    }
}

• Spring Security에서 네이버에서 받아온 정보를 가지고 사용자의 인증 및 권한 관련 기능을 제공합니다.
• UserDetails는 회원가입, 로그인 프로세스를 직접 구현한 경우 사용하고 OAuth2User는 소셜 로그인 구현한 경우 사용합니다.
• UserDetails, OAuth2User는 회원 정보를 따로 가지고 있지 않아 인터페이스를 구현하여 사용자의 정보를 제공합니다.

• OAuth2MemberInfo 인터페이스 : 네이버서 받은 사용자 정보를 다루며 각 속성에 대한 getXX() 메서드를 정의합니다.
• NaverMemberInfo 클래스 : 네이버로 부터 받은 사용자 정보를 추출합니다. 이 때 OAuth2MemberInfo 인터페이스의 getXX() 메서드를 구현하여 추출합니다.
• Oauth2MemberService 클래스 : 추출해온 정보를 가지고 처리하고 DB에 저장합니다.
• CustomOauth2UserDetails 클래스 : 네이버에서 받아온 정보를 가지고 네이버 소셜 로그인 사용자를 인증하고 권한을 부여합니다.

네이버에 로그인이 되어 있지 않은 경우,

DB에 저장