김쥬르에 개발일지

지금까지 만든 웹 서비스를 AWS Elastic Beanstalk를 이용하여 배포해보도록하겠습니다. Elastic Beanstalk? 서버 구축 및 배포에 필요한 EC2 RDS를 한 번에 설정하는 AWS 서비스입니다. 서버 업로드용 코드 작성만으로 서버를 쉽게 올릴 수 있고, 그외의 기능들 로드 밸런싱, 오토 스케일링, 모니터링, 배포 등을 일래스틱 빈스토크 메뉴 안에 직접 구성하거나 설정 파일로 자동 처리할 수 있습니다. 일래스틱 빈스토크는 추가 비용 없이 애플리케이션을 저장 및 실행하는데 필요한 AWS 리소스에 대해서만 요금을 지불하게됩니다. (AWS 계정 생성 과정은 생략합니다) https://ap-northeast-2.console.aws.amazon.com/elasticbeanstalk/home..

구글 소셜 로그인을 구현해보도록 하겠습니다. 구글 클라우드 콘솔 https://cloud.google.com/cloud-console 로 접속 후 우측 상단에 "콘솔" 버튼을 클릭합니다. 이동 후 좌측 상단에 "프로젝트 선택" -> "새 프로젝트" 를 클릭합니다. (저의 경우 이미 다른 프로젝트에 적용중이기에 "프로젝트 선택" 이 아닌 프로젝트 명으로 나옵니다) 프로젝트 이름은 자유롭게 사용하고 프로젝트 이름 설정 후 "만들기" 버튼을 클릭합니다. 좌측 상단에 햄버거 메뉴에서 "API 및 서비스" -> "사용자 인증 정보" 버튼을 눌러 사용자 인증을 관리하는 페이지로 이동합니다. 사용자 인증 정보를 만들려면 OAuth 동의 화면을 먼저 구성해야 합니다. "동의 화면 구성" 버튼을 누르고 User Type..

OAuth2? 제3의 서비스에 계정 관리를 맡기는 방식입니다.흔히 볼 수 있는 네이버,카카오톡,구글 등등 소셜 로그인하기 방법을 말합니다.OAuth를 이해하기 위해 관련 용어를 알아보겠습니다. 리소스 오너 자신의 정보를 사용하도록 인증 서버에 허가하는 주체입니다. 서비스를 이용하는 사용자가 리소스 오너에 해당합니다. 리소스 서버 리소스 오너의 정보를 가지며, 리소스 오너의 정보를 보호하는 주체를 의미합니다. 네이버 , 구글 , 카카오 등이 리소스 서버에 해당합니다. 인증 서버 클라이언트에게 리소스 오너의 정보에 접근할 수 있는 토큰을 발급하는 역할을 하는 애플리케이션을 의미합니다. 클라이언트 애플리케이션 인증 서버에게 인증을 받고 리소스 오너의 리소스를 사용하는 주체를 의미합니다. OAuth를 사용하면 ..

저번 포스팅에 이어서 JWT 테스트 코드를 통해 어떻게 동작하는지 살펴보고 구현이 잘되었는지 확인해보겠습니다. test 디렉터리에 config.jwt 패키지를 만들고 JwtFactory.java 를 생성하고 코드를 작성합니다. @Getter public class JwtFactory { private String subject = "test@email.com"; private Date issuedAt = new Date(); private Date expiration = new Date(new Date().getTime() + Duration.ofDays(14).toMillis()); private Map claims = emptyMap(); // 빌더 패턴을 사용해 설정이 필요한 데이터만 선택 설정 @..

JWT? JSON Web Token 의 줄임말로 JSON 객체로 정보를 주고 받을때 토큰 기반 인증으로 안전하게 전송하기 위한 방식입니다. 토큰 기반 인증? 사용자가 서버에 접근할 때 이 사용자가 인증된 사용자인지 확인하는 방법은 다양합니다. 대표적인 사용자 인증 확인 방법에는 서버 기반 인증과 토큰 기반 인증이 있습니다. 스프링 시큐리티에서는 기본적으로 세션 기반 인증을 사용해 사용자마다 사용자의 정보를 담은 세션을 생성하고 저장해서 인증을 합니다. 토큰 기반 인증은 토큰을 사용하는 방법입니다. 토큰은 서버에서 클라이언트를 구분하기 위한 유일한 값인데 서버가 토큰을 생성해서 클라이언트에게 제공하면 클라이언트는 이 토큰을 갖고 있다가 여러 요청을 이토큰과 함께 신청합니다. 그럼 서버는 토큰만 보고 유효한..

이번엔 스프링 시큐리티를 이용하여 로그인/로그아웃을 구현해보겠습니다. 스프링 시큐리티? 스프링 시큐리티는 스프링 기반의 애플리케이션 보안(인증,인가,권한)을 담당하는 스프링 하위 프레임워크입니다. 스프링 시큐리티를 이해하려면 인증과 인가에 대한 개념을 알아야합니다. 인증과 인가? 인증은 사용자의 신원을 입증하는 관정입니다. 예를 들어 사용자가 사이트에 로그인을 할 때 누구인지 확인하는 과정을 인증이라고 합니다. 인가는 사이트의 특정 부분에 접근할 수 있는지에 권한을 확인하는 작업입니다. 예를 들어 관리자는 관리자 페이지에 들어갈 수 있지만 일반 사용자는 관리자 페이지에 들어갈 수 없습니다. 이런 권한을 확인하는 과정을 인가라고 합니다. 스프링 시큐리티에 대해 더 알아보자면 보안 관련 옵션을 많이 제공합니..

이번엔 템플릿엔진을 이용하여 수정/삭제/생성 버튼을 추가하고 관련된 기능까지 코드를 작성해보겠습니다. 삭제기능 먼저 해보겠습니다. 삭제 코드는 자바스크립트로 작성을 해볼까요? src/main/resources/static 디렉터리에 js 디렉터리를 만들고 article.js 파일을 생성한후 아래 코드를 작성합니다. // 삭제 기능 const deleteButton = document.getElementById('delete-btn'); if (deleteButton) { deleteButton.addEventListener('click', event => { let id = document.getElementById('article-id').value; fetch(`/api/articles/${id}`,..

오늘은 템플릿엔진을 이용하여 실제 보여질 화면을 구성해보겠습니다. 템플릿엔진? 스프링 서버에서 데이터를 받아 우리가 보는 웹 페이지, 즉 HTML 상에 그 데이터를 넣어 보여주는 도구입니다. 다만 템플릿 엔진을 HTML과 함께 템플릿 엔진을 위한 문법을 섞어 사용해야합니다. 템플릿 엔진도 종류가 여러가지이지만 보편적으로 많이 사용하고 Spring Boot에서 권장하는 Thymeleaf를 사용해보도록 하겠습니다. 간단하게 템플릿 문법을 알아보겠습니다. (Thymeleaf) (서버) {이름 : 홍길동 나이 : 11} 서버에서 이러한 값이 템플릿엔진으로 전달됐다면 이렇게 값이 들어가는것입니다. 서버에서 이름,나이 라는 키로 데이터를 템플릿 엔진에 넘겨주면 템플릿 엔진은 이를 바탕으로 동적으로 값을 적용하여 동..

이번엔 수정 삭제를 구현해보겠습니다. 삭제부터 해보겠습니다. BlogService.java 파일을 delete() 메서드를 추가합니다. 메서드는 블로그 글의 ID를 받은 뒤 JPA에서 제공하는 deleteById() 메서드를 이용해 데이터베이스에서 데이터를 삭제합니다. public void delete(long id) { blogRepository.deleteById(id); } /api/articles/{id} DELETE 요청이 오면 글을 삭제하기 위한 findArticles() 메서드를 BlogApiController에 추가하겠습니다. @DeleteMapping("/api/articles/{id}") public ResponseEntity deleteArticle(@PathVariable long ..

저번 글 추가하기에 이어 글 조회 , 수정하기를 해보겠습니다. BlogService.java 파일을 열어 DB에 저장되어있는 글을 모두 가져오는 findAll() 메서드를 추가하겠습니다. @RequiredArgsConstructor // final이 붙거나 @NotNull이 붙은 필드의 생성자 추가 @Service // 빈으로 등록 public class BlogService { private final BlogRepository blogRepository; ----------------------생략------------------ public List findAll() { return blogRepository.findAll(); } 응답을 위한 DTO를 작성하겠습니다. dto 디렉터리에 Articl..