주요 기능은 다 구현하였으니 부가적으로 넣을 수 있는 기능을 생각해봤다. 프로필 사진과 게시판에 사진 업로드 기능이 있으면 좋겠다고 판단하였는데 문제가 하나 있었다. 바로, 사용자들이 올리는 모든 사진들을 모두 다 DB에 저장하면 DB가 너무 무거워지는 문제 였다. 팀원들과 상의 끝에 우리는 Object Storage를 떠올렸다. 하지만 또 다른 오류를 맞이하면서 그 오류 먼저 해결을 하느라...결국 object storage는 무산되었고ㅎㅎ 공부한 기록만 남겨둔다. Object Storage 란? 기존 파일 스토리지의 확장성 한계를 없앤 비정형 데이터를 위한 스토리지 이다. 대규모의 데이터를 안정적으로 저장하고 필요할 때 유연하게 활용할 수 있는 클라우드 기반의 스토리지 솔루션으로 많이 사용된다. 오브..

비밀번호 암호화 알고리즘 SHA-256 이란? SHA-256 (Secure Hash Algorithm 256-bit) SHA-256은 안전한 단방향 해시 함수로, 주로 비밀번호나 메시지를 안전하게 저장하거나 전송할 때 사용된다. "단방향"이라는 용어는 한 번 해시되면 원본 값을 복원할 수 없다는 것을 의미한다. SHA-256은 256비트 길이의 고정된 크기의 해시 값을 생성하며, 충돌 가능성이 매우 낮아 안전한 알고리즘 중 하나로 알려져 있다. 해싱이란? 해싱은 임의의 크기의 데이터를 고정된 크기의 고유한 값으로 변환하는 과정을 의미한다. 이 변환된 값은 해시 또는 해시 값이라고도 불린다. 해싱은 단방향 암호화 함수의 한 형태로, 원본 데이터를 해시 함수에 넣으면 항상 동일한 크기의 고유한 해시 값이 생..

이제 인증 메일과 비밀번호 암호화 기능을 추가 해보려고 한다. 사실 요즘엔 핸드폰 인증을 더 많이 쓰는 것 같긴한데...더 간단하고 스프링에서 기본으로 제공하는 API가 있고 돈이 안들어가는 이메일 인증 방법을 택했다. 이메일 인증은 회원가입 프로세스에서 중요한 단계 중 하나이다. 이메일 인증을 통해 회원 신원을 확인할 수 있으며 불법적인 가입이나 다른 사용자의 계정 사용을 방지해서 보안을 강화시킬 수 있는 것이 장점이다. 또한, 더 나아가면 중요한 서비스 안내나 소식 전달도 이메일을 통해 할 수 있을 것! 1️⃣ 링크 참고하여 이메일 설정 ( 2단계 인증 활성화 ) ⇒ https://myaccount.google.com/u/0/security?hl=k Google 계정 myaccount.google.c..

1️⃣ 중간발표 중간 발표를 무사히 마치고 앞으로 얼마 남지 않은 시간동안 개선해야 할 점을 정리해본다. 1. 인증메일 유효시간 2. alert 디자인 수정 3. 비밀번호 암호화 2️⃣ SweetAlert2 사용해 Alert문 디자인 추가 일단 head 태그 안에 sweetalert1이랑 2에 대한 CDN을 다 추가 해줬다. 💡 사용방법 참고 https://inpa.tistory.com/entry/SweetAlert2-📚-설치-사용 https://sweetalert.js.org/guides/ https://www.jsdelivr.com/package/npm/sweetalert2 ✅ travelList.jsp $(document).ready(function() { $(".deleteBtn").on("cli..

어제의 멘토링 이후 interceptor에 대한 의문점이 가득해서 interceptor와 filter에 대해 공부하기로 했다. 생각해보니 타당한 이유없이 그저 강사님께 배웠다고 아무런 생각없이 interceptor를 쓰고 있었구나 싶어 반성하는 계기가 됐다. 일단 개발을 하다 보면 공통적으로 처리해야될 부분들이 많고, Spring은 중복 코드를 최소화하고 공통적으로 여러 작업을 처리하기 위해 Filter(필터), Interceptor(인터셉터), 그리고 AOP(Aspect Oriented Programming, 관점 지향 프로그래밍)와 같은 기능을 제공한다. 이러한 기능들은 주로 어떤 행동을 하기 전에 먼저 실행하거나, 실행한 후에 추가적인 행동을 할 때 사용된다. ✅ Filter 란? 서블릿 컨테이너에..

전체적인 멘토링 피드백 비밀번호 암호화 비밀번호 평문으로의 저장은 보안 위험을 초래한다. 사용자의 개인 정보를 안전하게 유지할 수 있도록 비밀번호 암호화가 필요하다. 생각은 하고 있었는데 우선순위를 뒤로 미뤄놓은 상태라...전반적으로 프로젝트가 완성이 되면 꼭 구현해야겠다. 회원가입에서 전화번호의 필요성 사실 큰 이유가 있다기보다는 기본적인 회원가입폼에 어떤 항목들이 있지..? 하고 넣은건데 딱 찝어주셨다. 핸드폰으로 회원가입 인증을 하는 것이 아닌 이상, 개인정보 보안상 굳이 필요하지 않다면 안넣는게 더 나을 수도 있다는 피드백을 받았다. 생각해보니 인증을 이메일로 구현했기 때문에 멘토님 말씀대로 핸드폰은 굳이 안넣어도 될 거 같다는 생각이 들었다. 회원가입 이메일 인증 시 유효기간 설정 ⇒ 유효기간은..

1️⃣ 일정 삭제하기 중 DataIntegrityViolationException 오류 PPT를 제작하기 위해 기능들에 대한 화면 캡쳐를 하는데 일정 삭제에서 오류가 났다. 뭐지?! 일정 삭제 기능을 구현 완료 했을 때에는 분명 잘 됐었는데... 오류 창을 읽어보니 회원 탈퇴에서의 오류에서 봤던 것 같았다. 이래서 오류가 뭔지 해석하고, 원인을 알아보고, 해결하고 또 기록하는 과정이 중요하구나..를 새삼 느꼈다. 원인) 어찌됐든 원인은 무결성 제약 조건 위반이었다. 일정 삭제 구현 완료 했을 때에는 상세 일정 보기를 구현하기 전이라 travel 테이블만 관련있었는데 지금은 상세 일정 보기 기능 구현을 위해 plan 테이블에서 자식 레코드가 발견되어 외래 키 제약 조건에 위반 되었다는 것이다! 해결 방법)..

1️⃣ 일정상세보기 지도에 인포윈도우 추가 처음에는 마커와 마커 사이에 경로(?)를 그리는 것을 기획했었는데... 능력 부족으로 그건 구현하지 못하고 고민하다가 인포윈도우로 대체하기로 했다. ✔ 참고 https://apis.map.kakao.com/web/sample/markerWithInfoWindow/ https://olrlobt.tistory.com/39 ✅ memberRetrieve.jsp 기존에 있던 코드 중 addMarkers함수에 인포윈도우 관련 코드를 추가함 결과) 이렇게 마커 위에 인포윈도우가 생기고 ‘길찾기’를 클릭하면 이렇게 카카오맵을 통해 길찾기, 대중교통 등을 볼 수 있음! 이것으로 대체…ㅎㅎ

1️⃣ kakao map api와 DB 연동 travelRetrieve.jsp ✅ 지도만 나오는 버전 //서버에서 가져온 위치 정보를 JavaScript 변수에 할당 //var locations = ${locations}; // 서버에서 위도와 경도 정보를 비동기적으로 가져오는 함수 function getLocationsFromServer() { // AJAX 또는 Fetch를 사용하여 서버에서 위치 정보를 가져온다. // 서버에서 가져온 데이터는 JSON 형식. fetch('/app/loginCheck/travelDel?travelID='+travelID) // API 엔드포인트 .then(response => response.json()) .then(data => { console.log(data);..

1️⃣ 일정 상세보기 로직 구현과 대략적인 UI 구현 글번호와 비슷한 의미인 travelID을 고유값으로 하여 저장된 일정의 데이터들을 가져오는 방식으로 로직을 구현했고 jsp에서 받아와 출력할 수 있도록 했다. 일단 대략적인 폼만 완성... 오른쪽엔 카카오맵API를 통해 지도를 구현하고, PlanDTO를 사용해 세부 일정들을 출력해낼 예정이다. 👀 고민사항 저장한 일정들을 어떻게 보여줄까 고민중이다. 두가지 방안이 있는데 1. 카카오맵 API를 통해 저장한 장소들을 지도로 보여주기 2. 테이블 형태로 일정 내용을 보여주기 두가지 방안을 두고 사용자 입장에서 생각해봤을 때, 지도에 장소들이 나와야 동선이 더 한 눈에 들어올 것이라 생각됐다. 지도 구현을 위해 Plan 테이블에 위도와 경도 레코드를 추가했..