디벨로퍼스 앱ID : 1203105
개발환경
springBoot 3.4.0
springSecurity6
Vue.js 3.2.13
포트
Springboot : 8081
Vue : 8080
내용
현재 front에서 back으로 OAuth 2.0을 이용하여 카카오 로그인을 구현 중에 어려움을 겪고 있습니다.
원래 방식은 프론트에서 카카오 로그인 버튼을 클릭할 시 GET 요청을 보내고 백엔드에서는 제가 구현한 코드를 통해 카카오 로그인페이지로 리다이렉션되도록 설정했지만 SecurityConfig을 사용하면 굳이 직접 구현하지 않아도 된다고 하여 구현했던 코드를 이용하지 않고 SecurityConfig 만 사용하려하는데 카카오톡 로그인페이지가 리다이렉션이 되지 않아 문의드립니다.
아래 application.properties에서 client-id 와 client-secret은 값이 제대로 들어가있는 상태입니다.
tim.l
2월 21, 2025, 8:46오전
2
1개의 좋아요
Hello, @a3989957
Authorization endpoints for Kakao are defined in SecurityFilterChain but redirection isn’t working. Try this codes.
Suggested solution:
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
return http
.oauth2Login(oauth2 -> oauth2
.authorizationEndpoint(endpoint -> endpoint
.baseUri("/oauth2/authorization")
)
.redirectionEndpoint(endpoint -> endpoint
.baseUri("/oauth2/callback/*")
)
)
.authorizeRequests(auth -> auth
.requestMatchers("/", "/login/**").permitAll()
.anyRequest().authenticated()
)
.build();
}
application.properties settings:
spring.security.oauth2.client.registration.kakao.redirect-uri=${app.base.url}/oauth2/callback/kakao
spring.security.oauth2.client.registration.kakao.authorization-grant-type=authorization_code
spring.security.oauth2.client.registration.kakao.client-authentication-method=client_secret_post
spring.security.oauth2.client.registration.kakao.scope=profile_nickname,profile_image
spring.security.oauth2.client.provider.kakao.authorization-uri=https://kauth.kakao.com/oauth/authorize
spring.security.oauth2.client.provider.kakao.token-uri=https://kauth.kakao.com/oauth/token
spring.security.oauth2.client.provider.kakao.user-info-uri=https://kapi.kakao.com/v2/user/me
For the Vue.js frontend:
function redirectToKakaoLogin() {
window.location.href = "http://localhost:8081/oauth2/authorization/kakao";
}