본문 바로가기

동빈나 JSP 게시판 만들기

동빈나 JSP 게시판 만들기 따라하기 1-4강(로그인페이지 디자인, 회원데이터베이스 구축하기, 로그인 기능 구현하기)

시행일시 2021-05-21

강의에 환경설정 과정은 나와 있습니다. 저는 기존에 되어 있는 것이 잇어서 mySQL 빼고는 기존세팅을 활용하였습니다.

신규로 하시는 분은 영상 보시고 따라하셔도 될 것 같습니다.

https://www.youtube.com/watch?v=wEIBDHfoMBg&list=PLRx0vPvlEmdAZv_okJzox5wj2gG_fNh_6

 

https://www.youtube.com/watch?v=MtxFWczSFqU&list=PLRx0vPvlEmdAZv_okJzox5wj2gG_fNh_6&index=2

 

https://www.youtube.com/watch?v=kN8xRG6UPZM&list=PLRx0vPvlEmdAZv_okJzox5wj2gG_fNh_6&index=3

 

https://www.youtube.com/watch?v=RYo3OGlRoJw&list=PLRx0vPvlEmdAZv_okJzox5wj2gG_fNh_6&index=4

 

[1. 인덱스 페이지 구현]

index.jsp

※ 사진 설명 - index.jsp

처음 실행될 때 대부분 index.jsp 를 만들어서 첫 화면이 나오게 한답니다.

여기서는 indexjsp 주소를 입력했을 때 login.jsp 화면으로 넘어가게 설정하였습니다.

[2. 로그인 화면 구현]

반응형 웹(화면크기에 따라 웹 화면 구성을 자동으로 맞게 처리)과 bootstrap.css를 연결하는 부분입니다. login.jsp

각 코드로 구현된 모습입니다.

로그인 프레임을 보여주는 코드입니다.

[3. mySQL 로 DB를 만든다.]

동빈나님 영상 속 화면입니다.저는 미리 다 따라해놓고 다음날 하는거라 스크린샷이 없었습니다.

※ DB 설명

1. CREATE DATABASE BBS;

1) BBS 데이터베이스를 생성합니다.

2) 이 데이터베이스는 사용자의 회원가입 정보를 저장하고 있는 데이터베이스 입니다.

2. USE BBS;

1) BBS 데이터베이스를 사용하겠다고 SQL 문을 작성합니다.

3. CREATE TABLE USER ( userID VARCHAR(20) ~ PRIMARY KEY (userID) );

1) BBS 데이터베이스에 USER 라는 테이블을 생성합니다.

2) ID, Password, Name, Gender, Email 을 설정하고 기본키(PK)는 userID를 설정합니다.

4. show tables;

1) 테이블 목록을 확인합니다.

5. desc user;

1) user 테이블의 속성을 확인합니다.

6. INSERT INTO USER VALUES('gildong', '123456', '홍길동', '남자', 'gildong@naver.com');

1) user 테이블에 row 1개를 추가해봅니다. (테스트)

2) 이 때 테이블 속성의 순서와 추가하는 값의 순서가 동일해야 합니다.

7. select * from user;

1) user 테이블을 select 하여 조회합니다. ( 테스트 결과 확인)

8. commit;

1) 실행한 내용들을 commit; 하여 데이터베이스에 반영합니다.

9. desc user;

1) 다시 SQL 문을 작성하여 commit이 되었는지 확인합니다.

[4. 데이터베이스에서 가져오는 정보를 JSP 서버에서 처리하기 위해 user class를 생성합니다. - JavaBeen]

User.java

※ User 설명

1. 데이터베이스의 속성과 동일하게 변수들을 설정합니다.(userID ~ userEmail)

2. Getter 와 Setter를 생성합니다.

3. 하나의 데이터베이스를 처리하는 자바빈지가 완성됐습니다.

[5. 로그인 기능 구현 - JSP에서 회원 데이터베이스 테이블(user)에 접근할 수 있도록 DAO class 를 생성합니다.]

UserDAO.java, DAO는 데이터베이스 접근객체의 약자입니다.

데이터베이스에서 회원정보를 불러오거나, 데이터베이스에 회원정보를 넣고자 할 때 사용합니다.

※ UserDAO.java 설명

1. conn(데이터베이스 접근해주게 하는 객체), pstmt, rs(정보를 담을 수 있는 객체)를 생성합니다.

2. UserDAO() 생성자를 생성합니다. (실제로 mySQL에 접속을 하게 해주는 부분)

1) try, catch 문으로 예외처리를 합니다.

2) dbURL = localhost:3306/BBS, 내 컴퓨터 3306 포트의 BBS 데이터베이스에 접속할 수 있게합니다.

3) dbID, dbPassword를 설정합니다.

4) mySQL Driver를 찾을 수 있도록 Class.forName을 설정합니다. Driver는 mySQL에 접속할 수 있도록

매개체 역할을 하는 라이브러리입니다.(추가설치해야함)

5) conn = DriverManager.getConnection(); 해당 정보들로 DB에 접속할 수 있게 합니다.

접속이 완료되면 conn 객체 안에 접속된 정보가 담기게 됩니다.

3. 실제로 로그인을 시도하게 해주는 login 함수를 생성합니다.

1) userID, userPassword를 파라미터로 사용합니다.

2) String SQL로 실제 DB에 입력할 명령어를 작성합니다.

3) try, catch 문으로 예외처리를 합니다.

4) return 1 로그인 성공return -1 아이디오류, return 0 비밀번호 불일치, return -2는 데이터베이스 오류를

의미합니다.

5) pstmt 객체에 정해진 데이터베이스 문장을 삽입하는 인스턴스를 가져옵니다.

6) pstmt.setString (1, userID) 로 SQL Injection 해킹기법을 예방합니다.

(1) String SQL 로 하나의 문장을 미리 준비해놨다가(?), ?에 userID를 넣어주는 것입니다.

(2) 즉, DB는 ?를 userID에 넣어서 해당 부분이 사용자가 맞는지를 확인할 수 있는 것입니다.

7) rs = pstmt.executeQuery() 로 rs에 실행한 결과를 넣어줍니다.

8) if 문으로 로그인성공, 아이디오류, 비밀번호 불일치, 데이터베이스 오류시에 대한 상황을 정의합니다.

[6. loginAction - 사용자에게 login 함수를 실행했을 때 로그인 결과를 보여주는 페이지를 작성합니다.]

userDAO 클래스, PrintWriter 클래스, request.setCharacterEncoding("UTF-8") (한글처리)을 임포트 및 선언합니다.

한명의 회원 정보를 담는 user라는 클래스를 자바빈지를 사용합니다.(<jsp:useBean>)

로그인 페이지에서 넘겨준 userID 를 받아서 한 명의 사용자의 userID를 넣어주는 setProperty를 작성합니다.(password도)

※ loginAction 설명

1. UserDAO 인스턴스를 1개 생성합니다.

2. int result 로 로그인 시도를 할 수 있게 합니다.

1) 로그인 함수를 사용함으로써, result에 -2 ~ 1 등 갖가지 결과값이 담기게 됩니다.

2) result에 결과값에 따라 결과들을 작성합니다. (if ~ else if)