[JSP 개발] MySQL DB 연동: 간단한 JSP 게시판 만들기 (글 쓰기 / 열람 / 수정 / 삭제)

2022. 12. 22. 23:52·■ Web/JSP
반응형

0. 목적

JSP와 MySQL을 JDBC드라이버를 통해 연결한 후, 간단한 게시판을 만들어 보도록 하자. 게시판의 기능은 글 쓰기 / 글 열람 / 글 수정 / 글 삭제의 총 4가지 기능을 구현 해 보자. 간단한 JSP 게시판이므로, CSS는 이용하지 않고 오직 기본 HTML 템플릿으로만 구성한다.

 

▣ 상세한 프로그램 실행구조

더보기

① 메인 화면인 main.html 을 Apache Tomcat 서버를 이용해 실행한다.

 

② 글 보기 버튼을 클릭하면, MySQL에 위치한 pratice_board 스키마의 post 테이블의 정보를 가져온다.

 

③ post_list.jsp 로 연결되어, post 테이블의 정보를 출력한다. (게시글 리스트를 출력한다.)

 

④ 게시글의 제목을 누르면, post_read.jsp로 연결되어 게시글의 상세한 정보를 출력한다.

 

⑤ 게시글의 상세한 정보를 읽다가, 글을 수정하고 싶으면 수정 버튼을 누른다. post_modify.jsp로 연결된다.

    ⑤ - 1. post_modify.jsp 에서 글을 수정하고, 저장 버튼을 누르면 post_modify_send.jsp로 연결되어 MySQL DB에 해당 내용을 저장한다.

    ⑤ - 2. 자동으로 post_list.jsp 로 리다이렉트 되어 게시글 목록을 출력한다.

 

⑥ 게시글의 상세한 정보를 읽다가, 글을 삭제하고 싶으면 삭제 버튼을 누른다. post_delete_send.jsp로 연결된다.

    ⑥ - 1. 게시글의 정보를 조회하고 MySQL DB에 해당 게시글을 삭제한다.

    ⑥ - 2. 자동으로 post_list.jsp 로 리다이렉트 되어 게시글 목록을 출력한다.

 

 

 


1. 참고

본 포스트에서는 MySQL 8.0.31과 Eclipse for Web Developers 2020-06, Apache Tomcat v9.0을 사용했다. 동시에, MySQL 접속 포트번호는 3306이며 MySQL 접속 ID와 PW는 root로 동일하다. JDBC 드라이버는 공식 홈페이지에서 제공하는 J-Connector을 사용했다. 기본 세팅이 준비되지 않았다면, 아래의 링크를 참고해 조치하도록 하자.

 

 

[Eclipse Tip] Eclipse 프로젝트에 Apache Tomcat 서버 설정하기

0. 목적 Eclipse 프로젝트에서 사용할 수 있는 Apache Tomcat 서버를 설정해 보도록 하자. 주로 Eclipse에서 Dynamic Web Project를 사용하는 사람들이라면, 반 필수적으로 사용해야 하는 서버이지 않을까 싶다

acredev.tistory.com

 

[JSP 기초] JDBC 드라이버를 이용해 DBMS와 JSP 연동하기

0. 목적 JDBC 드라이버를 이용해, JSP와 DBMS를 연동하는 방법에 대해 알아보자. DBMS라 함은, 데이터베이스 관리 시스템의 약자로 MySQL DB, Maria DB 등등이 이에 포함된다. 본 포스트에서는 DBMS의 대표적

acredev.tistory.com

 

 

 


2. 프로젝트 기본 계획

상기 구조에서 설명했듯이, 본 프로젝트에서 필요한 Web 파일은 아래와 같이 계획했다.

파일명 역할
main.html 메인 화면 출력
post_list.jsp 게시글 리스트 출력
post_new.jsp 신규 게시글 작성 폼 출력
post_new_send.jsp 신규 게시글 작성 내역을 전송
post_read.jsp 게시글 상세내용 출력
post_modify.jsp 게시글 수정 폼 출력
post_modify_send.jsp 게시글 수정 내역을 전송
post_delete_send.jsp 게시글 삭제 정보를 전송

 

DataBase는 아래와 같이 계획했다.

num은 게시글 번호로서, AUTO_INCREMENT 속성을 부과해 게시글 작성시 자동으로 +1 되도록 계획한 것이다.

 

 

 

3. DB 생성

CREATE TABLE `pratice_board`.`post` (
  `num` INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
  `title` VARCHAR(50) NOT NULL,
  `writer` VARCHAR(50) NOT NULL,
  `content` TEXT NOT NULL,
  `reg_date` DATETIME NOT NULL,
  );

계획했던 내용을 토대로 SCHEMA를 만들고, TABLE을 생성하자.

 

 

 

정상적으로 pratice_board.post DB가 생성되었다.

 

 

 


4. Eclipse 프로젝트 생성

계획했던 내용을 토대로 프로젝트를 생성하고, 상기와 같이 Web 파일들을 제작하자.

 

 

 


5. [메인] main.html 작성

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>게시판 연습 메인화면</title>
</head>
<body>
  <h1>게시판 연습의 메인 화면입니다.</h1>
  <button type="button" onclick="location.href='post_list.jsp'"><h3>글 목록 바로가기</h3></button>
</body>
</html>

아주 간단하게 메인 화면을 제작했다. 글 목록 바로가기 버튼을 누르면, post_list.jsp로 연결되어 글 목록이 출력되는 구조이다. 너무 간단한 html 코드라 추가 설명을 적어두진 않겠다.

 

▣ 임시 실행 화면

더보기

 

 

 


6. [글 목록] post_list.jsp 코드작성

<!-- SQL 연결을 위한 import -->
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
    
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>게시글 목록</title>
</head>
<body>
    <!-- 게시글 목록 폼임을 표시 -->
    <h1>게시글 목록</h1>
      <%
      try
      {
        // JDBC 드라이버 연결
        Class.forName("com.mysql.jdbc.Driver");
        String db_address = "jdbc:mysql://localhost:3306/pratice_board";
        String db_username = "root";
        String db_pwd = "root";
        Connection connection = DriverManager.getConnection(db_address, db_username, db_pwd);
        
        // MySQL로 전송하기 위한 쿼리문인 insertQuery 문자열 선언
        String insertQuery = "SELECT * FROM pratice_board.post order by num desc";
        
        // MySQL 쿼리문 실행
        PreparedStatement psmt = connection.prepareStatement(insertQuery);
        
        // 쿼리문을 전송해 받아온 정보를 result 객체에 저장
        ResultSet result = psmt.executeQuery();%>
        
        <!-- 게시글 목록을 표시할 기본 테이블 생성 -->
        <table border="1">
        <tr>
          <td colspan="5">
            <h3>게시글 제목 클릭시 상세 열람 가능</h3>
          </td>
        </tr>
        <tr>
		  <td colspan="5">
            <button type="button" value="신규 글 작성" onClick="location.href='post_new.jsp'">신규 글 작성</button>
          </td>
        </tr>
        <tr>
          <td>번호</td>
          <td>작성자</td>
          <td>제목</td>
          <td>작성일</td>
          <td>관리</td>
        </tr>
        <%
        // 받아온 정보를 입력하고, 하나씩 커서를 다음으로 넘김
        while (result.next())
          {%>
            <tr>
              <!-- 번호 <td> 아래에 DB에서 받아온 num 칼럼값 삽입 -->
              <td><%=result.getInt("num") %></td>
              
              <!-- 작성자 <td> 아래에 DB에서 받아온 writer 칼럼값 삽입 -->
              <td><%=result.getString("writer") %></td>
              
              <!-- 제목 <td> 아래에 DB에서 받아온 title 칼럼값 삽입, 제목 클릭시 post_read.jsp로 연결되며 num 칼럼값을 parameter로 넘김 -->
              <td><a href="post_read.jsp?num=<%=result.getInt("num") %>"><%=result.getString("title") %></a></td>
              
              <!-- 작성일 <td> 아래에 DB에서 받아온 reg_date 칼럼값 삽입 -->
              <td><%=result.getTimestamp("reg_date") %></td>
              
              <td>
                <!-- 수정 버튼을 누르면 post_modify.jsp로 연결되며 num 칼럼값을 parameter로 넘김 -->
                <button type="button" value="수정" onClick="location.href='post_modify.jsp?num=<%=result.getString("num") %>'">수정</button>
                <!-- 삭제 버튼을 누르면 post_delete_send.jsp로 연결되며 num 칼럼값을 parameter로 넘김 -->
                <button type="button" value="삭제" onClick="location.href='post_delete_send.jsp?num=<%=result.getString("num") %>'">삭제</button>
              </td>
            </tr>
            <%
            }%>
          </table>
        <%
        }
      catch (Exception ex)
      {
        out.println("오류가 발생했습니다. 오류 메시지 : " + ex.getMessage());
      }%>
</body>
</html>

게시글 목록 리스트를 출력할 post_list.jsp 코드를 작성했다. 간단한 코드 설명들은 주석으로 달아두었으니 참고하면 된다.

 

▣ 임시 실행 화면

더보기

 ※ DB에 어떠한 게시글 정보도 저장되어 있지 않은 상태이기 때문에, 공란으로 출력된다.

 

 ※ 아래는 정상적으로 값들이 INSERT 되었을 때의 예시 화면이 되겠다.

 

 

 


7. [신규 게시글 작성] post_new.jsp 코드작성

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>신규 게시글 작성</title>
</head>
<body>
    <h1>신규 게시글 작성</h1>
    <!-- 입력값을 전송하기 위한 post method 방식의 form action 선언 -->
    <form action="post_new_send.jsp" method="post">
        <table>
            <tr>
                <td>작성자</td>
                <td><input type="text" name="writer"></td>
            </tr>
            <tr>
                <td>제목</td>
                <td><input type="text" name="title"></td>
            </tr>
            <tr>
                <td>내용</td>
                <td><textarea rows="10" cols="20" name="content"></textarea></td>
            </tr>
            <tr>
                <td colspan="2">
                    <!-- 저장 버튼을 누르면 post_read_send.jsp로 연결되며, -->
                    <!-- submit 형식의 button을 통해, post 방식으로 내용 전송 -->
                    <button type="submit">저장</button>
                    <!-- 목록으로 버튼을 누르면 post_list.jsp로 연결됨 -->
                    <button type="button" onclick="location.href='post_list.jsp'">목록으로</button>
                    <!-- 초기화 버튼을 누르면 text 입력값이 모두 초기화됨 -->
                    <button type="reset">초기화</button>
                </td>
            </tr>
        </table>
    </form>
</body>
</html>

간단한 HTML 코드들을 통해, 신규 게시글을 작성할 수 있는 폼을 만들어 보았다.

 

form action 메서드를 통해 button type="submit" 로 지정한 저장 버튼을 누를 경우, post 방식으로 해당 폼의 내용이 post_new_send.jsp로 이동하며 작용된다. 코드에 주석을 달아두었으니, 어떻게 작용되는 방식인지 차근차근 읽어가며 참고하면 좋을 것 같다.

 

▣ 임시 실행 화면

더보기

 ※ 단순한 HTML 폼으로, 여기서 작성한 정보를 전송해 줄 post_new_send.jsp 가 없다면 작동하지 않는 폼이다.

 

 

 


8. [신규 게시글 작성내역 전송] post_new_send.jsp 코드작성

<%@page import="java.sql.Timestamp"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>

<%
try
{
    // JDBC 드라이버 연결
    Class.forName("com.mysql.jdbc.Driver");
    String db_address = "jdbc:mysql://localhost:3306/pratice_board";
    String db_username = "root";
    String db_pwd = "root";
    Connection connection = DriverManager.getConnection(db_address, db_username, db_pwd);
    
    // 문자열의 인코딩 방식 결정
    request.setCharacterEncoding("UTF-8");
    
    // 오늘 날짜 정보를 컴퓨터에서 받아올 객체 선언
    Timestamp today_date = new Timestamp(System.currentTimeMillis());
    
    // 파라미터를 통해 전해진 작성자, 제목, 내용 정보를 받아와 각 문자열 변수에 저장
    String writer = request.getParameter("writer");
    String title = request.getParameter("title");
    String content = request.getParameter("content");
	
	// 게시글 번호를 결정하기 위한 임시 정수형 변수 선언
	int num = 0;
	
	// MySQL로 전송하기 위한 쿼리문인 insertQuery 문자열 선언 (현재 등록된 게시글의 갯수를 파악)
	String insertQuery = "SELECT MAX(num) from pratice_board.post";
	
	// SQL 쿼리문을 실행 (MySQL로 전송)하기 위한 객체 선언
	PreparedStatement psmt = connection.prepareStatement(insertQuery);
	
	// 조회된 결과물들을 저장하기 위한 ResultSet 객체 선언
	ResultSet result = psmt.executeQuery();
	
	// 받아온 정보가 있을때
	while(result.next())
	{
            // 앞서 임시 선언한 num 변수에, 가져온 MAX(num) 칼럼값 + 1을 하여 저장
	    num = result.getInt("MAX(num)") + 1;
	}
	
	// MySQL로 전송하기 위한 쿼리문인 insertQuery 문자열 선언 (사용자가 post_new.jsp 폼에서 작성한 정보를 전송)
	insertQuery = "INSERT INTO pratice_board.post(num, title, writer, content, reg_date) VALUES (?, ?, ?, ?, ?)";
	
	// SQL 쿼리문을, 새로운 내용을 토대로 재실행
	psmt = connection.prepareStatement(insertQuery);
	
	// VALUES ? 값에 하나씩 삽입하여 전송
	psmt.setInt(1, num);
	psmt.setString(2, title);
	psmt.setString(3, writer);
	psmt.setString(4, content);
	psmt.setTimestamp(5, today_date);
	
	// INSERT 하여 반영된 레코드의 건수결과를 반환
	psmt.executeUpdate();
	
	// 모두 완료되면, post_list.jsp(글 목록) 폼으로 되돌아 온다.
	response.sendRedirect("post_list.jsp");
}
catch (Exception ex)
{
    out.println("오류가 발생했습니다. 오류 메시지 : " + ex.getMessage());
}
%>

사용자가 post_new.jsp의 HTML 폼에서 작성한 내용을 토대로, MySQL의 post TABLE에 삽입해 줄 코드를 작성했다.

 

사용자는 post_new.jsp 폼에서 작성자, 제목, 내용의 정보만을 작성한다. post_new_send.jsp에서는, MySQL에 내용들을 INSERT하며 자동으로 게시글 번호와 작성일자값을 생성/불러와 전송하게 된다.

 

코드 순서대로 주석을 따라 읽으면서, 어떻게 작동되는지 참고하자.

 

▣ 임시 실행 화면

더보기

 ※ post_new_send.jsp는 post_new.jsp와 상호작용 하는 폼이다.

 ※ post_new.jsp의 HTMLtable 폼에서 사용자가 입력한 값을 MySQL에 전송하기 위한 코드가 담겨있는 파일이 바로 post_new_send.jsp 파일이 되겠다. 절대 헷갈리지 않도록 주의하자.

 

 

 


9. [글 상세내용 열람] post_read.jsp 코드작성

<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>게시글 상세 열람</title>
</head>
<body>
    <h1>게시글 상세 열람</h1>
    <%
    try
    {
        // JDBC 드라이버 연결
        Class.forName("com.mysql.jdbc.Driver");
        String db_address = "jdbc:mysql://localhost:3306/pratice_board";
        String db_username = "root";
        String db_pwd = "root";
        Connection connection = DriverManager.getConnection(db_address, db_username, db_pwd);
        
        // 받아오는 문자열의 인코딩 방식 결정
        request.setCharacterEncoding("UTF-8");
        
        // 파라미터를 통해 전해진 게시글 번호를 받아와, num 변수에 저장
        String num = request.getParameter("num");
        
        // MySQL로 전송하기 위한 쿼리문인 insertQuery 문자열 선언 (읽어온 게시글 번호를 통해, 불러올 게시글을 결정함)
        String insertQuery = "SELECT * FROM pratice_board.post WHERE num=" + num;
        
        // SQL 쿼리문을 실행 (MySQL로 전송)하기 위한 객체 선언
        PreparedStatement psmt = connection.prepareStatement(insertQuery);
        
        // 조회된 결과물들을 저장하기 위한 ResultSet 객체 선언
        ResultSet result = psmt.executeQuery(); %>
        
        <table border="1">
            <%
            // 받아온 정보가 있을때
            while(result.next())
            {%>
            	<tr>
            	    <!-- 번호 <td> 옆에 DB에서 받아온 num 칼럼값 삽입 -->
            	    <td>번호</td>
            	    <td><%=result.getInt("num") %></td>
            	</tr>
            	<tr>
            	    <!-- 작성일 <td> 옆에 DB에서 받아온 reg_date 칼럼값 삽입 -->
            	    <td>작성일</td>
            	    <td><%=result.getTimestamp("reg_date") %></td>
            	</tr>
            	<tr>
            	    <!-- 작성자 <td> 옆에 DB에서 받아온 writer 칼럼값 삽입 -->
            	    <td>작성자</td>
            	    <td><%=result.getString("writer") %></td>
            	</tr>
            	<tr>
            	    <!-- 제목 <td> 옆에 DB에서 받아온 title 칼럼값 삽입 -->
            	    <td>제목</td>
            	    <td><%=result.getString("title") %></td>
            	</tr>
            	<tr>
            	    <!-- 내용 <td> 옆에 DB에서 받아온 content 칼럼값 삽입 -->
            	    <td>내용</td>
            	    <td><%=result.getString("content") %></td>
            	</tr>
            	<tr>
            	    <td colspan="2">
            	        <!-- 목록으로 버튼을 누르면 post_list.jsp로 연결됨 -->
            	        <button type=button onclick="location.href='post_list.jsp'">목록으로</button>
            	    </td>
            	</tr>
            	<%            	
            }%>
        </table>
        <%
    }
    catch (Exception ex)
    {
        out.println("오류가 발생했습니다. 오류 메시지 : " + ex.getMessage());
    }%>

</body>
</html>

게시글 제목을 클릭했을 때, 해당 게시글 내용을 상세 열람할 post_read.jsp 코드를 작성했다. 코드 주석을 따라 읽으며 작동 방식을 참고하자.

 

▣ 임시 실행 화면

더보기

 ※ 게시글 번호를 파라미터값으로 받아와 작용하는 폼으로, 단독으로 실행시 받아오는 파라미터값이 없으니 빈칸이 출력된다.

※ post_list.jsp에서 게시글 번호가 존재하는 항목의 제목 을 눌렀을 때, 받아올 파라미터값이 존재하므로 올바르게 동작한다.

 

 


10. [글 수정 폼] post_modify.jsp 코드작성

<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>글 수정</title>
</head>
<body>
    <h1>글 수정</h1>
    <%
    try
    {
    	// JDBC 드라이버 연결
        Class.forName("com.mysql.jdbc.Driver");
        String db_address = "jdbc:mysql://localhost:3306/pratice_board";
        String db_username = "root";
        String db_pwd = "root";
        Connection connection = DriverManager.getConnection(db_address, db_username, db_pwd);
        
        // 문자열의 인코딩 방식 결정
        request.setCharacterEncoding("UTF-8");
        
        // 게시글 번호를 파라미터값을 통해 받아와 정수형 변수에 저장
        String num = request.getParameter("num");
        
        // MySQL로 전송하기 위한 쿼리문인 insertQuery 문자열 선언 (읽어온 게시글 번호를 통해, 불러올 게시글을 결정함)
        String insertQuery = "SELECT * FROM pratice_board.post WHERE num=" + num;
        
        // SQL 쿼리문을 실행 (MySQL로 전송)하기 위한 객체 선언
        PreparedStatement psmt = connection.prepareStatement(insertQuery);
        
        // 조회된 결과물들을 저장하기 위한 ResultSet 객체 선언
        ResultSet result = psmt.executeQuery();
        
        // 받아온 정보가 있을 때
        while(result.next())
        {%>
            <!-- 입력값을 전송하기 위한 post method 방식의 form action 선언 -->
            <form action="post_modify_send.jsp" method="post">
            <!-- 숨겨진 textbox에 num값을 삽입해, 수정 버튼을 누르면 함께 post_modify_send.jsp로 전송 -->
            <input type="hidden" name="num" value="<%=result.getInt("num") %>">
            <table border="1">
                <tr>
                    <!-- 작성자 <td> 옆에 DB에서 받아온 writer 칼럼값 삽입 -->
                    <td>작성자</td>
                    <td><input type="text" name="writer" value="<%=result.getString("writer") %>"></td>
                </tr>
                <tr>
                    <!-- 제목 <td> 옆에 DB에서 받아온 title 칼럼값 삽입 -->
                    <td>제목</td>
                    <td><input type="text" name="title" value="<%=result.getString("title") %>"></td>
                </tr>
                <tr>
                    <!-- 내용 <td> 옆에 DB에서 받아온 content 칼럼값 삽입 -->
                    <td>내용</td>
                    <td><textarea rows="10" cols="20" name="content"><%=result.getString("content") %></textarea>
                </tr>
                <tr>
                    <td colspan="2">
                        <!-- 수정 버튼을 누르면 post_modify_send.jsp로 연결되며, -->
                        <!-- submit 형식의 button을 통해, post 방식으로 내용 전송 -->
                        <button type="submit">수정</button>
                        <!-- 목록으로 버튼을 누르면 post_list.jsp로 연결됨 -->
                        <button type="button" onclick="location.href='post_list.jsp'">목록으로</button>
                        <!-- 원상복구 버튼을 누르면 text 입력값이 DB에서 받아왔던 원상태로 모두 초기화 -->
                        <button type="reset">원상복구</button>
                    </td>
                </tr>
            </table>
            </form>
    <%
        }
    }
    catch (Exception ex)
    {
    	out.println("오류가 발생했습니다. 오류 메시지 : " + ex.getMessage());
    }%>
</body>
</html>

글 목록에서, 수정 버튼을 눌렀을 때 해당 글을 수정할 수 있는 post_modify.jsp 코드를 작성했다. 코드 주석을 따라 읽으며 작동과정을 참고하자.

 

▣ 임시 실행 화면

더보기

 ※ 게시글 번호를 파라미터값으로 받아와 작용하는 폼으로, 단독으로 실행시 받아오는 파라미터값이 없으니 빈칸이 출력된다.

※ post_list.jsp에서 게시글 번호가 존재하는 항목의 수정 버튼을 눌렀을 때, 받아올 파라미터값이 존재하므로 올바르게 동작한다.

 

 

 


11. [글 수정내역 전송] post_modify_send.jsp 코드작성

<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<%
try
{
    // JDBC 드라이버 연결
    Class.forName("com.mysql.jdbc.Driver");
    String db_address = "jdbc:mysql://localhost:3306/pratice_board";
    String db_username = "root";
    String db_pwd = "root";
    Connection connection = DriverManager.getConnection(db_address, db_username, db_pwd);
    
    // 문자열의 인코딩 방식 결정
    request.setCharacterEncoding("UTF-8");
    
    // 파라미터를 통해 전해진 작성자, 제목, 내용 정보를 받아와 각 문자열 변수에 저장
    String writer = request.getParameter("writer");
    String title = request.getParameter("title");
    String content = request.getParameter("content");
    
    // 파라미터를 통해 전해진 게시글 번호를 받아와, num 변수에 저장
    String num = request.getParameter("num");
    
    // MySQL로 전송하기 위한 쿼리문인 insertQuery 문자열 선언 (읽어온 게시글 번호를 통해, 수정할 게시글을 다시한번 결정(확인)함)
    String insertQuery = "SELECT * FROM pratice_board.post WHERE num=" + num;
    
    // SQL 쿼리문을 실행 (MySQL로 전송)하기 위한 객체 선언
    PreparedStatement psmt = connection.prepareStatement(insertQuery);
 	
    // 조회된 결과물들을 저장하기 위한 ResultSet 객체 선언
    ResultSet result = psmt.executeQuery();
 	
    // 받아온 정보가 있을때
    while(result.next())
    {
        // MySQL로 전송하기 위한 쿼리문인 insetQuery 문자열 선언 (사용자가 post_modify.jsp 폼에서 수정한 정보를 전송)
        insertQuery = "UPDATE pratice_board.post set title=?, writer=?, content=? WHERE num=" + num;
 	    
        // SQL 쿼리문을, 새로운 내용을 토대로 재실행
        psmt = connection.prepareStatement(insertQuery);
        
        // VALUES ? 값에 하나씩 삽입하여 전송
        psmt.setString(1, title);
        psmt.setString(2, writer);
        psmt.setString(3, content);
        
        // INSERT 하여 반영된 레코드의 건수결과를 반환
        psmt.executeUpdate();
        
        // 모두 완료되면, post_list.jsp(글 목록) 폼으로 되돌아 온다.
        response.sendRedirect("post_list.jsp");
 	}
}
catch (Exception ex)
{
    out.println("오류가 발생했습니다. 오류 메시지 : " + ex.getMessage());
}
%>

사용자가 post_modify.jsp의 폼에서 수정한 내용을 토대로, MySQL의 post TABLE에 수정본을 삽입해 줄 코드를 작성했다.

 

사용자는 post_modify.jsp 폼에서 불러와진 작성자, 제목, 내용 항목만을 수정한다. post_modify_send.jsp에서는, MySQL에 내용들을 UPDATE하며 전송하게 된다.

 

코드 주석을 따라 읽으면서, 작동 방식을 참고하도록 하자.

 

▣ 임시 실행 화면

더보기

 ※ post_modify_send.jsp는 post_modify.jsp와 상호작용 하는 폼이다.

 ※ post_modify.jsp의 table 폼에서 사용자가 입력한 값을 MySQL에 전송하기 위한 코드가 담겨있는 파일이 바로 post_modify_send.jsp 파일이 되겠다. 절대 헷갈리지 않도록 주의하자.

 

 

 


12. [글 삭제정보 전송] post_delete_send.jsp 코드작성

<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>

<%
try
{
	// JDBC 드라이버 연결
    Class.forName("com.mysql.jdbc.Driver");
    String db_address = "jdbc:mysql://localhost:3306/pratice_board";
    String db_username = "root";
    String db_pwd = "root";
    Connection connection = DriverManager.getConnection(db_address, db_username, db_pwd);
    
    // 문자열의 인코딩 방식 결정
    request.setCharacterEncoding("UTF-8");
    
    // 파라미터를 통해 전해진 게시글 번호를 받아와, num 변수에 저장
    String num = request.getParameter("num");
    
    // MySQL로 전송하기 위한 쿼리문인 insertQuery 문자열 선언 (읽어온 게시글 번호를 통해, 수정할 게시글을 다시한번 결정(확인)함)
    String insertQuery = "DELETE FROM pratice_board.post WHERE num=" + num;
    
    // SQL 쿼리문을 실행 (MySQL로 전송)하기 위한 객체 선언
 	PreparedStatement psmt = connection.prepareStatement(insertQuery);

    // DELETE 하여 반영된 레코드의 건수결과를 반환
    psmt.executeUpdate();
 	
    // 모두 완료되면, post_list.jsp(글 목록) 폼으로 되돌아 온다.
    response.sendRedirect("post_list.jsp");
}
catch (Exception ex)
{
	out.println("오류가 발생했습니다. 오류 메시지 : " + ex.getMessage());
}
%>

사용자가 post_list.jsp의 폼에서 삭제 요청한 게시글 정보를 토대로, MySQL의 post TABLE에 DELETE 요청을 전송해 줄 코드를 작성했다.

 

코드 주석을 따라 읽으면서, 작동 방식을 참고하도록 하자.

 

▣ 임시 실행 화면

더보기

 ※ post_modify_send.jsp는 post_list.jsp와 상호작용 하는 폼이다.

 ※ post_list.jsp의 글 목록에서, 사용자가 삭제 버튼을 눌러 삭제 요청한 게시글을 MySQL에 전송하기 위한 코드가 담겨있는 파일이 바로 post_delete_send.jsp 파일이 되겠다. 절대 헷갈리지 않도록 주의하자.

 

 

 


13. 최종 작동 모습

 

 

 

 


14. 소스코드 다운로드

본 JSP 게시판 프로젝트의 소스코드는 필자의 GitHub에서 제공된다. 참고하면 도움이 될 것 같다.

 

▣ 프로젝트 파일 전체 다운로드

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

▣ main.html 코드 확인

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

▣ post_list.jsp 코드 확인

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

▣ post_new.jsp 코드 확인

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

▣ post_new_send.jsp 코드 확인

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

▣ post_read.jsp 코드 확인

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

▣ post_modify.jsp 코드 확인

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

▣ post_modify_send.jsp 코드 확인

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

▣ post_delete_send.jsp 코드 확인

 

GitHub - acredev/blog_JSP_ex

Contribute to acredev/blog_JSP_ex development by creating an account on GitHub.

github.com

 

300x250
반응형
저작자표시 비영리 변경금지 (새창열림)
'■ Web/JSP' 카테고리의 다른 글
  • [JSP 개발] DB연동 게시판 파일 다운로드 / 업로드 기능 구현
  • [JSP 기초] JDBC 드라이버를 이용해 DBMS와 JSP 연동하기
Min Hyuk-Lee
Min Hyuk-Lee
시스템 엔지니어로 근무하고 있습니다.
  • Min Hyuk-Lee
    아크레의 개발로그
    Min Hyuk-Lee
    m_file@naver.com
  • 전체
    오늘
    어제
    • 📝 Log. (84)
      • ■ Dev. Language (11)
        • C (5)
        • C# (6)
      • ■ Dev. ETC (8)
        • Unity 3D (3)
        • Android Studio (JAVA) (5)
      • ■ Web (6)
        • HTML (3)
        • JSP (3)
      • ■ Linux (8)
        • Shell (2)
        • Linux Tip. (6)
        • 보안취약점 진단 (0)
      • ■ Windows (4)
        • Server (1)
        • Windows Tip. (3)
      • ■ VM (1)
        • VMWare (1)
        • Virtual Box (0)
      • ■ Database (9)
        • MySQL (7)
        • OracleDB (2)
      • ■ DevKit (5)
        • IDE (4)
        • Tool (1)
      • ■ Error (20)
        • Windows 오류해결 (1)
        • Linux 오류해결 (5)
        • DB 오류해결 (4)
        • IDE 오류해결 (2)
        • VM 오류해결 (3)
        • Unity 오류해결 (4)
        • SSH, SFTP 오류해결 (1)
      • ■ Photoshop (3)
        • 디자인&이미지 창작 (3)
      • ■ Document (3)
        • MS Word (2)
        • PDF (1)
      • ■ Study (4)
        • Baekjoon (4)
      • ■ 작문 (1)
        • 회고 (1)
      • ■ ETC (1)
        • Car (0)
        • etc (1)
  • 🌐 Menu

    • 📓 Guestbook
  • 🔗 Other Links

    • GitHub
    • 아크레의 IT ISSUE
  • 📢 Notice

    • [스킨 업데이트] hELLO v4.10.0 적용완료
    • [스킨 업데이트] hELLO v4.9.0 적용 완료
    • [스킨 업데이트] hELLO v4.8.1 적용 완료
  • 💬 Recent Comments

  • hELLO· Designed By정상우.v4.10.0
Min Hyuk-Lee
[JSP 개발] MySQL DB 연동: 간단한 JSP 게시판 만들기 (글 쓰기 / 열람 / 수정 / 삭제)
상단으로

티스토리툴바