[20221018] myweb 로그인/로그아웃, 아이디저장, 아이디 중복확인, 이메일 중복확인

kangsun·2022년 10월 18일

jsp myweb

JSP

목록 보기

10/16

로그인 02

로그인 session (이전 수업 복기)

1. 맨 처음 요청할 때는 아이디가 없다
세션에서 아이디를임시로 생성해주고 아이디를 웹브라우저에 전달한다.
2. 아이디를 생성하면 내 고유 아이디를 세션이 저장한다.

로그인 유효성 검사

다른페이지에서도 로그인 실패여부 유지하는 방법

로그인을 했으면 로그인이 성공했다는 정보가 로그인페이지에서만 유지되어야하는 것이 아니라 다른페이지로 이동했을 때에도 로그인에 대한 성공 실패 여부를 myweb 안에서 유지되어야 한다.
➡️ session을 이용해야한다.

loginProc.jsp

로그인 성공 후 이동페이지

→ intro 페이지? ✅
→ 장바구니를 보고있으면 장바구니 화면 그대로 ?
→ 카페페이지에서 로그인하면 카페 페이지 현상 유지시켜줄 건지 ?
➡️ URL값 체크하면 된다.

➡️ 우리는 intro 페이지로 가도록 할 것이다.

myweb 폴더명 변수처리하는 방법 2가지

폴더명을 myweb 그대로 배포하면 안된다. 해당 사이트 이름으로 변경해주려면 프로젝트 이름을 변수처리하면 된다.

1. request.getContextPath()

2. Utility.getRoot();

로그인 성공 후 로그아웃페이지

세션값에 원하는 값이 들어오지 않았다는 것은(null) 로그인을 하지 않았다는 의미임.

auth.jsp파일 생성
로그인 상태 정보 확인 조건식 추가

session.setAttribute("s_id", id);
session.setAttribute("s_passwd", passwd);
session.setAttribute("s_mlevel", mlevel);

setAttribute()를
getAttribute() - get으로 가져와야한다.

loginForm.jsp로 이동

auth.jsp inclue
loginForm.jsp에서 if-else문으로 나누어준다.

- if : 아이디가 guest이거나 비밀번호가 guest이거나 등급이 guest 라면 (셋중 하나라도 guest라면) (비회원) → 로그인 페이지를 보여주고
- else : 로그인을 성공했다면 로그아웃할 수 있는 링크가 있는 페이지를 보여준다.
결과확인

로그아웃

logout.jsp 생성 후 session.removeAttribute() 해주면 된다.

- 로그아웃 후 로그인 페이지로 이동시켜준다.

⚠️ 에러 : 로그아웃 클릭해도 로그아웃되지 않았음

- guest → geust로 오타냄 ..

삭제기능은 A등급에게만 보여주기

bbsRead에 auth.jsp 추가
if 조건절 추가

- 등급이 A1이라면 삭제버튼을 보여준다.

⚠️ 에러 : HTTP 상태500 내부서버오류

⚠️ 에러 해결방법

ssi.jsp 객체생성하는게 포함되어 있어 include 할 때 제일 위 상단으로 올려야 오류가 나지 않는다.

이유는 모르겠지만 저는 경로가
<%@ include file="../bbs/ssi.jsp" %>
이렇게 되니 됐습니다
그냥 경로를 ssi.jsp로 하니 오류가 나더라구요

로그인 아이디 저장 기능

ID 저장을 체크해주면 본인의 아이디를 저장할 수 있는 기능이다.
-> 로그인을 성공했을 때만 저장해준다.

- 서버가 쿠키를 저장해준다.
- 쿠키는 서버에서 가지고 있어도 문제없는 데이터만 저장한다.
- 보안성이 없다.
- 자바에서 쿠키 클래스가 있다.
- 자바스크립트에도 있음.
- 쿠키는 사용자 pc에 저장해준다.

사용예)
.하루동안 이벤트창 오픈 하지 않기
.ID/PASSWORD 자동으로 저장기능 등 입력된 값의 자동 출력
.내가 클릭한 상품 목록

아이디저장 체크박스 요소 먼저 확인

아이디 저장 체크박스의 요소들 중 value값에 SAVE라는 글자가 있으면 체크가 되어있다는 것이다. 체크를하지않으면 안넘어온다.

체크를 하면 SAVE
체크를 하지 않으면 null

아이디저장 체크박스 값 가져오기 (쿠키값도)

loginProc.jsp

- Utility.checkNull() 함수를 사용해서 아이디가 null이면 빈 공백으로 리턴해주도록 한다.

아이디저장 쿠키 확인

loginForm.jsp

사용자 pc에 저장된 쿠키값을 모두 가져와서, 쿠기값이 존재하는지 하나씩 모두 검색한 후, 그 중 아이디값을 찾아 쿠키이름과 같다면 아이디박스에 해당 아이디를 넣어준다.

아이디 폼에 c_id 변수 넣어주기.
아이디저장 체크박스에 조건 넣어주기

- 아이디가 비어있지않다면 체크해주기

로그인 아이디 저장 기능 결과확인

아이디/비밀번호 찾기 링크, 로그인 성공 시 회원정보수정, 회원탈퇴 링크

loginForm.jsp

➡️ 회원에 관련된 것 완료 후 다시 제작할 예정

회원가입

회원약관

(1) 회원약관 파일 받고 확인

(2)회원약관 폼 전송시킬 action, submit 작성해주기

(3) send() script 작성

(4) 결과확인

ID 중복확인

새로운페이지에 만들 것인지 ✅
현재페이지에서 확인할 것인지 (AJAX) - Spring 공부 후에 해보기

(1) form에 onsubmit 추가하기

(2) myscript.js에서 idCheck() 함수 작성

※ 아이디 중복확인 창의 종류

1) 모달창
부모창과 자식창이 한몸으로 구성되어있음
- 참조 https://www.w3schools.com/bootstrap/bootstrap_modal.asp
2) 새창 ✅
부모창과 자식창이 별개로 구성되어있음
모바일에 기반을 둔 frontend 단에서는 사용하지 말것!!
- 참조 https://www.w3schools.com/jsref/met_win_open.asp
- window.open("파일명","새창이름","다양한옵션들")