Server Programming/Spring Boot Full-Stack Programming (45) 썸네일형 리스트형 [스프링 풀스택 클론 코딩] Node.js (npm) 연동 Node.js 설치 후 프로젝트의 /static 경로에 npm init을 이용해 부트스트랩을 설치한다. cd spring_dev/main/src/resources/static npm init npm install bootstrap npm install jquery --save .gitignore ##NPM## src/main/resources/static/node_modules src/main/resources/static/node -> 업데이트를 안하도록 설정 빌드 설정 -> 메이븐 빌드시, static 디렉토리에 있는 package.json도 빌드하도록 com.github.eirslett frontend-maven-plugin 1.8.0 v4.6.0 src/main/resources/static in.. [스프링 풀스택 클론 코딩] 로그인 여부에 따른 네비게이션 메뉴 구성 의존성 추가 후 네임스페이스 설정 org.springframework.security spring-security-test test xmlns:sec="http://www.thymeleaf.org/extras/spring-security" index 로그인 가입 알림 스터디 개설 프로필 Username 프로필 스터디 설정 로그아웃 데모 © 2020 로그인 가입 알림 스터디 개설 프로필 로그인 상태 일때 : 알림, 스터디 개설, 프로필 메뉴 로그아웃 상태 일때 : 로그인, 가입 메뉴 Username 프로필 스터디 설정 로그아웃 로그인 상태일때, 로그인된 아이디의 이름을 출력한다. Username [스프링 풀스택 클론 코딩 - 회원가입] (1-12) 회원 가입 메인 네비게이션 메뉴 강의에 사용되었던 버전과 달라, 현재 버전에 맞춰서 사용해야한다. index.html 로그인 가입 알림 스터디 개설 프로필 Username 프로필 스터디 설정 로그아웃 데모 © 2020 https://getbootstrap.com/docs/5.2/components/dropdowns/ Dropdowns Toggle contextual overlays for displaying lists of links and more with the Bootstrap dropdown plugin. getbootstrap.com [스프링 풀스택 클론 코딩] 회원 가입 완료 후 자동 로그인해야하는 경우 authenticatied는 mockMvc에서 제공하는 기능이다. @DisplayName("회원 가입 화면이 보이는지 테스트") .andExpect(unauthenticated()); @DisplayName("회원 가입 처리 - 입력값 오류") .andExpect(unauthenticated()); @DisplayName("회원 가입 처리 - 입력값 정상") .andExpect(authenticated().withUsername("@")); @DisplayName("인증 메일 확인 - 입력값 오류 ") .andExpect(unauthenticated()); @DisplayName("인증 메일 확인 - 입력값 정상") .andExpect(authenticated().withUsername("@")); Ac.. [스프링 풀스택 클론 코딩 - 회원가입] (1-11) 회원 가입 완료 후 자동 로그인 회원가입, 이메일 인증 완료시 자동 로그인 -> 컨트롤러에서 회원가입 완료, 토큰 일치 확인 = completeSignUp() 후 자동로그인 AccountService package com.demo.account; import java.util.List; import org.springframework.mail.SimpleMailMessage; import org.springframework.mail.javamail.JavaMailSender; import org.springframework.security.authentication.AuthenticationManager; import org.springframework.security.authentication.UsernamePasswordAuthen.. [스프링 풀스택 클론 코딩 - 회원가입] (1-10) 회원 가입 인증 메일 확인 테스트 및 리팩토링 H2 DB의 경우 애플리케이션 종료시 초기화 된다. 1. 테스트 코드 작성 (1) 입력값 오류 (2) 입력값 정상 2. 리팩토링 (1) 코드의 위치 수정 (2) 코드의 가독성 높이기 (3) 코드의 메서드화 1. 입력값 오류, 입력값 정상 테스트 작성 -> 마찬가지로, 토큰값 생성하고 @Transactional로 DB싱크 맞춘 후, 동일 여부 확인 package com.demo.account; import static org.junit.Assert.assertNotEquals; import static org.junit.Assert.assertNotNull; import static org.mockito.ArgumentMatchers.any; import static org.mockito.BDDMockit.. [스프링 풀스택 클론 코딩] 회원가입 이메일 인증 정상/오류 시 분기 1. 에러 발생시 2. 에러가 null인 경우 -> 해당하는 model에서 numberOfUser와 nickname을 가져온다. th:if="${error}" th:if="${error == null}" th:text="${numberOfUser}" th:text="${nickname}" 3. 해당 이메일에 대한 토큰값과 해당 이메일 정상 여부 확인하기 위해서는 @Transactional 어노테이션 적용필수 -> DB와의 싱크 위해 @Transactional public void processNewAccount(SignUpForm signUpForm) { // 1. 회원정보 저장 // 2. 이메일 토큰 만들기 // 3. 이메일 전송 Account newAccount = saveNewAccount(sign.. [스프링 풀스택 클론 코딩 - 회원가입] (1-9) 회원가입 이메일 인증 확인 이메일 인증을 하는 이유 : 가짜 이메일을 통해, 무분별한 가입을 막기 위함 -> 토큰값을 이용해, 전송한 토큰과 일치 여부를 확인하는 것이 필요하다. (1) 이메일 확인 오류 -> 토큰값 불일치, 이메일 주소 불일치 등 보안을 위해 응답정보제공 최소화 (2) 이메일 확인 성공 -> 몇번째 유저인지 리턴 소셜 인증을 사용하는 방법도 존재 -> api를 이용 localhost:8080/check-email-token?token=4cfa2712-354b-403f-8d18-53fdca98d788&email=your@gamil.com을 이용해 이메일 인증 확인 메일 체크 checked-email 로그인 가입 데모 이메일 확인 이메일 확인 링크가 정확하지 않습니다. 데모 이메일 확인 이메일을 확인했습니다. 10번.. 이전 1 2 3 4 5 6 다음