관리 메뉴

클라이언트/ 서버/ 엔지니어 "게임 개발자"를 향한 매일의 공부일지

데이터베이스를 이용한 회원 관리 시스템 구축하기 7 - 회원 가입을 위한 프로그래밍 1 : 회원 정보 입력을 위한 서블릿 클래스와 입력 폼 그리고 자바스크립트 파일 작성하기 본문

웹 · 앱 개발/JSP & Servlet

데이터베이스를 이용한 회원 관리 시스템 구축하기 7 - 회원 가입을 위한 프로그래밍 1 : 회원 정보 입력을 위한 서블릿 클래스와 입력 폼 그리고 자바스크립트 파일 작성하기

huenuri 2024. 12. 15. 20:59

다음으로는 회원 가입을 위한 프로그래밍을 짜보겠다.


 

 

 

 

 

회원 가입을 위한 프로그래밍

로그인은 가입이 완료된 회원에 한해서 가능하고 비회원인 경우에는 회원 가입부터 해야 한다. 회원 가입 과정은 회원 정보를 입력받은 후 진행된다. 로그인 폼에서 <회원 가입> 버튼을 클릭하면 회원 가입을 위한 입력 폼을 띄우기 위한 join.do를 get 방식으로 요청한다.

 


 

 

 

 

 

[직접 해보기] 회원 정보 입력 폼을 위한 서블릿 클래스 만들기

 

1. 서블릿 클래스 만들기

 

 

 

 

이와 같이 JoinServlet 클래스를 만든다.


 

 

 

 

 

2. 서블릿 클래스 코드 작성하기

 

join.do가 get 방식으로 요청되면 회원 가입을 위한 폼인 join.jsp를 띄운다. 이제 회원 가입을 위해 정보를 입력받는 폼을 작성해 보겠다.


 

 

 

 

 

[직접 해보기] 회원 가입을 위한 회원 정보를 입력받는 폼

 

 

 

 

 

다음은 중복 체크 버튼을 클릭하면 아이디 중복 체크를 위한 페이지로 이동하도록 하기 위한 자바스크립트 함수인 indCheck() 함수이다.


 

 

 

 

 

[직접 해보기] 중복 체크 페이지를 새로운 창으로 띄우기 위한 자바스크립트 함수

 

1. 코드 작성하기

 

아이디 중복 치크를 위해서는 아이디를 입력받아야 한다. 아이디 중복 케크를 위한 idcheck.jsp 페이지는 현재 페이지가 아닌 새로운 창에 출력한다. 자바스크립트에서 새로운 창을 띄우기 위해서 window 객체의 open() 메서드를 제공한다.


 

 

 

2. 코드 실행하기

 

 

 

 

하지만 코드를 실행하면 이런 메시지가 뜬다. 아이디 중복 체크 버튼 클릭 시 404 오류가 발생하는 이유는 idCheck.do에 해당하는 매핑(Controller 또는 Servlet)이 설정되지 않았기 때문이다.

사실 뭔가 잘못한 줄 알고 당황했는데 아직 코드를 작성하지 않았을 뿐이다.

 

아이디 중복 체크를 위해서는 데이터베이스에 존재하는 아이디인지 점검하기 위한 메서드를 DAO에 추가해야 한다.

 


 

 

 

 

 

[직접 해보기] 아이디 중복 체크를 위한 메서드 추가하기

 

자바스크립트로 아이디 중복 체크를 위한 함수를 추가하였기에 <중복 체크> 버튼을 클릭하연 idCheck.do가 요청된다. 


 

 

 

 

학습을 마치고

회원 가입 인증을 하고 아이디를 중복 체크하는 파일까지 만들어보았다. 아이디 중복 체크를 위한 프로그램은 아직 몇 개 더 만들어야 해서 다음 포스트에 이어서 학습해 보겠다.

오늘 저녁까지 열심히 공부해도 9장을 겨우 마칠 수 있을 것이다. 그래도 여기까지 온 이상 제대로 공부해서 JSP 학습을 잘 마무리해 볼 것이다. 아직 두 Chapter 이상 남아있지만 이 과목도 조금은 흥미가 생기는 것 같다.