Spring Security CORS 에러

Question

안녕하세요 Spring Security 와 JWT 토큰을 활용한 로그인을 구현하는 도중에 에러가 생겼는데 도저히 해결이 되지 않아 질문 글을 작성합니다.Spring boot 로 회원 가입 및 로그인 기능을 제공하는 서비스를 개발하였습니다.먼저 회원 가입을 위한 Entity를 설계하고 Controller - Service - Repository (JPA) 과정을 거쳐, 회원가입을 하는 POST API를 설계했습니다.로그인의 경우 Spring Security에서 기본적으로 login Api를 제공하더군요. (/login) 저는 이 기본 로그인을 그대로 활용하였습니다.인증 및 권한을 설정하기 위해 WebSecurity 라는 Config 클래스를 생성하였습니다. Spring Boot 최신 버전에서는 SecurityFilterChain을 사용하기를 권장하길래 여러 자료를 참조해 필터를 설정하였습니다.그 다음 사용자 이름과 비밀번호를 기반으로 인증을 처리하기 위해 UsernamePasswordAuthenticationFilter를 상속하는 AuthenticationFilter 클래스를 생성하였습니다.얼추 설계가 끝나고 PostMan으로 회원가입 요청을 날려보니 회원가입이 정상적으로 처리되었고, 로그인 또한 정상적으로 성공하여 JWT 토큰을 발급 받았습니다.API가 성공적으로 작동하는것을 보고, 저는 Vue 프로젝트를 생성하여 Axios 를 통해 회원가입 요청을 날려보니 h2 데이터베이스에 정상적으로 회원이 등록된것을 확인했습니다. (원래는 안됐는데 WebMvcConfigurer를 구현한 Config 클래스에서 addCorsMappings()를 재정의하여 vue 출처에서 들어오는 요청을 허용하니 되었습니다.)문제는 login을 할때 Access to XMLHttpRequest at 'http://192.168.61.252:8082/login' from origin 'http://localhost:5173' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.라는 에러가 나옵니다.원인이 뭘까요?package com.kbds.userservice.security; import com.kbds.userservice.service.UserService; import lombok.extern.slf4j.Slf4j; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.boot.autoconfigure.security.servlet.PathRequest; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.Configuration; import org.springframework.core.env.Environment; import org.springframework.security.authentication.AuthenticationManager; import org.springframework.security.config.annotation.ObjectPostProcessor; import org.springframework.security.config.annotation.authentication.builders.AuthenticationManagerBuilder; import org.springframework.security.config.annotation.web.builders.HttpSecurity; import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity; import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder; import org.springframework.security.web.SecurityFilterChain; @Configuration @EnableWebSecurity @Slf4j public class WebSecurity { private UserService userService; private BCryptPasswordEncoder bCryptPasswordEncoder; private Environment env; private final ObjectPostProcessor

Devvy · Answer

CORS 설정이 필요합니다. http.cors(cors -> cors.disable());많이들 Postman으로는 되는데 브라우저에 frontend를 띄워서 요청을 보내면 왜 안되냐 물어보십니다. 원인은 브라우저의 CORS 정책때문입니다. 브라우저에서는 다른 origin(scheme + host + port 의 조합)에 요청을 보낼 때 CORS 설정이 없으면 서버로 요청은 가지만 브라우저에서 데이터를 보여주지 않습니다. Frontend와 backend의 origin을 각각 확인해보시면 서로 다른걸 알 수 있습니다. 예시 frontend: http://localhost:3000 backend: http://localhost:8080 Spring의 CORS 설정하는방법을 찾아보시고 -> CORS 설정 후 -> http request에 대한 응답 헤더를 확인해서 Access-Control-XXX 과 관련된 헤더를 살펴보시면 됩니다.

Spring Security CORS 에러

1개의 답변

Q&A 목록