팡민`s 개발블로그 팡민`s 개발블로그

통합배포가 아닌 Frontend와 Backend서버를 따로 배포한다면 위와같이 CORS 에러가 발생하는 것을 자주 볼 수 있습니다. 위와 같은 에러 메시지는 가장 기본적인 cors에러의 하나입니다. SecurityConfig , WebMvcConfig , ResponseMessage 여러 단에서 처리 할 수 있습니다! 대표적인 풀이 @Configuration public class WebMvcConfig implements WebMvcConfigurer { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**") .allowedOrigins("http://localhost:3000") .allowCre..

프로젝트를 수행하면서 문자인증을 통해 회원가입 서비스를 제공하기 위해서 Naver SENS(문자 전송) + Redis(토큰 관리) 를 이용하였습니다. 대략적인 흐름도는 다음과 같습니다. 1. Vue에서 유저 전화번호를 axios REST API로 SpringBoot에 전달합니다. 2. SpringBoot에서 Naver SENS API로 유저의 전화번호로 인증번호를 전송(SMS 서비스)합니다. 3. Redis 서버에 해당 인증번호(Map 토큰)를 저장하고, 4. SpringBoot에서 5.번호 비교를 할때마다 해당 인증번호와 비교해서 동일하면 해당 토큰을 삭제하고, 1. 에서 새로운 요청이 들어오면 기존 토큰을 삭제하고 다시 1~5. 과정을 반복합니다. Naver SENS API 초기 설정. 네이버 클라우..

SpringSecurity를 이용하여 OAuth2.0 로그인 기능을 구현하면서 ... OAuth2.0을 SpringSecurity 백엔드에서 구현하는 방법과 프론트엔드에서 구현하는 방법은 어떤 차이점이 있는지에 대해서 의문이 생겼고, 방법에 따라 어떠한 인증 종류를 써야하는지 포스팅으로 공유하려고 합니다. OAuth2.0 인증 종류 OAuth2.0 인증 종류는 크게 4가지가 있지만, 주로 사용되는 방법인 Authorization Code Grant와 Client Credentials Grant 방식 중 첫번째를 이번 포스팅으로 공유합니다. 1. Authorization Code Grant Authorization Code Grant 방식의 특징. 서버사이드 코드로 인증하는 방식 권한서버가 클라이언트와 리..

SpringSecurity를 이용하여 Oauth2 로그인을 구현 도중 공부한 내용에 대해서 정리를 하기 위해 포스팅을 작성하였습ㅈ니다. 1. Oauth 란? 간단하게 인증(Authentication)과 권한(Authorization)을 획득하는 것으로 볼 수 있습니다. 구글, 페이스북, 카카오 등에서 제공하는 Authorization Server를 통해 회원 정보를 인증하고, Access Token을 발급받아 타사의 API 서비스를 이용할 수 있습니다. 2. Oauth의 배경 third party Application에 아이디와 비밀번호를 제공하고 싶지 않은 요구가 급증하였습니다. 개인정보를 여러 곳에 입력하면 피싱에 노출되고 무엇보다 해당 Application이 안전하다는 보장이 없기 떄문에 보안에 취..

1. Docker란? Spring 개발을 해오면서 Docker를 이용한 프로젝트 배포에 흥미를 느껴, Docker에 대하여 공부하였습니다. 위키에서 정의한 도커는... 도커는 리눅스의 응용 프로그램들을 프로세스 격리 기술들을 사용해 컨테이너로 실행하고 관리하는 오픈 소스 프로젝트이다. 도커 웹 페이지의 기능을 인용하면 다음과 같다: 도커 컨테이너는 일종의 소프트웨어를 소프트웨어의 실행에 필요한 모든 것을 포함하는 완전한 파일 시스템 안에 감싼다. 요약하면, 도커는 리눅스 기반의 기술을 이용해 프로그램을 컨테이너로 관리, 실행하는 오픈소스 가상화 플랫폼입니다. 도커를 이해할려면 어떤 리눅스 기술을 이용하는지 알아볼 필요가 있습니다. 2. Docker 기반 기술 : cgroups & namespaces 리눅..

스프링 빈은 Thread-safe 할까? Spring Bean의 기본 Scope는 싱글톤입니다. 그러면 싱글톤 객체(Bean)를 멀티 쓰레드 환경(Spring)에서 다루게 되면 해당 객체는 Thread-safe 한 상태 일까요? 즉, Spring은 싱글톤 객체(Bean)에 대해서 Thread-safe를 보장합니까? 결과적으로, Spring은 Bean에 대해서 Thread-safe를 보장하지 않습니다. 즉, 개발자가 스프링 빈을 Thread-safe하게 개발해야 합니다. 기본적으로 쓰레드는 각각 Stack 영역을 소유하며, 공유하는 Heap 영역이 있습니다. 각 쓰레드에서 싱글톤 객체(Bean)에 접근할 때, 싱글톤 객체는 자신의 Heap 영역(전역 변수)에는 불변 변수를, Stack 영역(지역 변수)에는..

백준 1260번 DFS와 BFS https://www.acmicpc.net/problem/1260 1260번: DFS와 BFS 첫째 줄에 정점의 개수 N(1 ≤ N ≤ 1,000), 간선의 개수 M(1 ≤ M ≤ 10,000), 탐색을 시작할 정점의 번호 V가 주어진다. 다음 M개의 줄에는 간선이 연결하는 두 정점의 번호가 주어진다. 어떤 두 정점 사 www.acmicpc.net 문제 해석 DFS와 BFS 기본기를 익힐 수 있는 문제. 입력으로 들어오는 정점 연결 정보를 이용하여 DFS, BFS 탐색을 수행하여 탐색한 순서를 출력하면 됩니다. 입력 : 정점의 개수(N), 간선의 개수(M), 정점 번호(V) 두 정점을 잇는 간선 연결 정보 출력 : 첫째 줄에 DFS를 수행한 결과를, 그 다음 줄에는 BFS..

1. 프로젝트를 수행하면서.. Vue와 SpringBoot으로 프로젝트를 진행하기 시작할 무렵, 디자인에 대한 고민이 있었습니다. 초기에는, 그리드로 웹 영역을 나누어 스스로 만들어보았지만 결과물이 형편 없어서 BootStrap 5 템플릿을 적용해보기로 하였습니다. 이 글은 타인이 만든 BootStrap 5 템플릿을 Vue에 적용시키는 방법에 대한 팁으로서, 추후에 다른 템플릿을 더 적용해보면서 개선해 나갈 예정입니다. 적용 템플릿 : https://github.com/zuramai/voler GitHub - zuramai/voler: The first Bootstrap 5 admin dashboard template The first Bootstrap 5 admin dashboard template. ..