[Day 20] 게시판 구현

게시판 구현 및 데이터베이스 연동 개요

위 코드는 기본적인 게시판 기능을 구현한 예제입니다.

• 사용자 입력: 사용자가 작성한 글 정보를 서버로 전송.
• 데이터 처리: 서버는 데이터를 데이터베이스에 저장.
• 결과 처리: 정상적으로 처리되었는지 사용자에게 알림.

---

코드 상세 설명

1. 데이터베이스 테이블 생성

게시판 데이터를 저장하기 위한 테이블 board1 생성.

create table board1(
    seq int not null primary key auto_increment,
    subject varchar(150) not null,
    writer varchar(12) not null,
    mail varchar(50),
    password varchar(41) not null,
    content varchar(2000),
    hit int not null,
    wip varchar(15) not null,
    wdate date not null
);

컬럼 설명:

• seq: 게시글 고유 번호, 자동 증가.
• subject: 제목.
• writer: 작성자.
• mail: 이메일.
• password: 비밀번호, 보안 위해 password() 함수 사용.
• content: 게시글 내용.
• hit: 조회수, 기본값 0.
• wip: 작성자의 IP 주소.
• wdate: 등록일.

---

2. 데이터베이스 사용자 생성

새로운 데이터베이스 사용자 board 생성 및 권한 부여.

create database board;
create user board@localhost identified by '123456';
grant all privileges on board.* to board@localhost;

목적: 데이터베이스 보안을 위해 별도의 사용자 계정을 생성.

---

코드 상세 분석

board_write1.jsp

글쓰기 화면을 제공. 사용자로부터 제목, 작성자, 이메일, 비밀번호, 내용을 입력받음.

<form action="board_write1_ok.jsp" method="post" name="wfrm">
    ...
    <input type="text" name="writer" value="" />
    <input type="text" name="subject" value="" />
    <input type="password" name="password" value="" />
    <textarea name="content"></textarea>
    ...
</form>

1. 입력 값 검증 (JavaScript)
   사용자가 작성한 내용이 비어 있으면 경고 메시지를 출력하고, 서버로 데이터 전송을 중단.

   document.getElementById('wbtn').onclick = function () {
       if (document.wfrm.writer.value.trim() == '') {
           alert('글쓴이를 입력하셔야 합니다.');
           return false;
       }
       document.wfrm.submit();
   };

2. 개인정보 수집 동의
   사용자가 동의하지 않으면 글쓰기 진행을 막음.

   if (document.wfrm.info.checked == false) {
       alert('동의하셔야 합니다.');
       return false;
   }

3. 목록 이동 버튼
   글쓰기 취소 시 게시글 목록 페이지로 이동.

   <input type="button" value="목록" onclick="location.href='board_list1.jsp'" />

---

board_write1_ok.jsp

사용자가 작성한 데이터를 데이터베이스에 저장.

<%
    String subject = request.getParameter("subject");
    String writer = request.getParameter("writer");
    String mail = request.getParameter("mail1") + "@" + request.getParameter("mail2");
    String password = request.getParameter("password");
    String content = request.getParameter("content");
    String wip = request.getRemoteAddr();
%>

1. 입력 값 처리:

   • request.getParameter()를 사용하여 폼 데이터를 받아옴.
   • 이메일은 두 개의 필드(mail1, mail2)를 조합.

2. 데이터베이스 연결:

   • JNDI로 데이터베이스 연결 풀을 사용.
   • DataSource 객체를 통해 커넥션을 가져옴.

   Context initCtx = new InitialContext();
   Context envCtx = (Context) initCtx.lookup("java:comp/env");
   DataSource dataSource = (DataSource) envCtx.lookup("jdbc/mariadb1");
   conn = dataSource.getConnection();

3. SQL 실행:

   • 게시글 데이터를 insert SQL 문으로 저장.
   • 비밀번호는 password() 함수로 암호화.

   String sql = "insert into board1 values ( 0, ?, ?, ?, password( ? ), ?, 0, ?, now() )";
   pstmt = conn.prepareStatement(sql);
   pstmt.setString(1, subject);
   pstmt.setString(2, writer);
   pstmt.setString(3, mail);
   pstmt.setString(4, password);
   pstmt.setString(5, content);
   pstmt.setString(6, wip);
   int result = pstmt.executeUpdate();

4. 결과 처리 (JavaScript):
   성공 여부에 따라 메시지를 출력하고 다음 페이지로 이동.

   out.println("<script type='text/javascript'>");
   if (flag == 0) {
       out.println("alert( '글쓰기 성공' );");
       out.println("location.href='./board_list1.jsp';");
   } else {
       out.println("alert( '글쓰기 실패' );");
       out.println("history.back();");
   }
   out.println("</script>");

---

페이지 간의 흐름

1. 사용자가 board_write1.jsp에서 글을 작성.
2. board_write1_ok.jsp로 데이터를 전송해 데이터베이스에 저장.
3. 저장이 완료되면 board_list1.jsp로 이동.

---

결론

위 코드는 게시판 구현의 기본 틀로, CRUD(생성, 읽기, 수정, 삭제) 기능을 중심으로 설계되었습니다.

1. 유효성 검사: 클라이언트 단에서 기본적인 입력값 검증.
2. JNDI와 커넥션 풀: 데이터베이스 연결 성능 최적화.
3. 보안 처리: 비밀번호는 암호화 후 저장.

추가 학습:

• 게시글 목록 페이지(board_list1.jsp)와 상세보기 페이지(board_view1.jsp)를 구현하여 흐름을 완성.
• 입력값 검증 로직을 백엔드에서도 추가로 처리.