2017. 4. 10. 18:05ㆍJava/web
브라우저로 게시된 글을 확인하는 화면을 출력해보자
게시판 리스트 화면에서 글을 선택하여 확인하는 화면을 만들어보자. 아래와 같은 구조로 진행될 것이다.
첫 번째로 bbs.properties 파일에서 /content.bbs 요청에 ContentImpl클래스가 실행되도록 매핑한다.
#bbs.properties /writeForm.bbs=com.edu.bbs.WriteFormImpl /write.bbs=com.edu.bbs.WriteImpl /list.bbs=com.edu.bbs.ListImpl /content.bbs=com.edu.bbs.ContentImpl
list.jsp에서 <table>태그 내에 '변경 부분' 주석 아래의 코드를 삽입한다. 게시글 타이틀(title)에 링크를 걸고, 쿼리스트링으로 선택한 게시글의 글 번호(articleNumber)와 현재 위치해 있는 페이지 번호(pageNum)을 데이터로 던져준다. 이렇게 쿼리스트링에 주어진 데이터 articleNumber와 pageNum은 JSP 내장 객체인 request에 자동으로 심어지는 듯하다(파라미터 변수인 name에).
<c:forEach var="article" items="${articleList}" varStatus="status">
<tr align="center" height="30">
<!-- EL(Expression Language) -->
<!-- <td>\&{item.articleNumber}</td> -->
<!-- <td>${item.articleNumber}</td> -->
<td>${article.articleNumber}</td>
<%-- <td><c:out value="${article.articleNumber}"></c:out></td> --%>
<%-- <td align="left">${article.title}</td> --%>
<td align="left">
<c:if test="${article.depth > 0}">
<img src="" width="${10 * article.depth}" height="16">
<img src="">
</c:if>
<!-- 변경 부분 -->
<a href="/bbs/content.bbs?articleNumber=${article.articleNumber}&pageNum=${pageNum}">${article.title}</a>
<c:if test="${article.hit >= 20}">
<img src="" border="0" height="16">
</c:if>
</td>
<td>${article.id}</td>
<td>${article.writeDate}</td>
<td>${article.hit}</td>
<tr>
</c:forEach>
ContentImpl클래스를 생성하고 아래와 같이 작성한다. ContentImpl클래스는 request객체에 심어진 articleNumber에 해당되는 게시글을 DB에서 가져오며, 해당 게시글의 조회수를 1 증가 시킨다.
package com.edu.bbs;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class ContentImpl implements BBSService {
@Override
public String bbsService(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String articleNumber = req.getParameter("articleNumber");
BBSDto article = null;
try {
article = BBSOracleDao.getInstance().selectArticle(articleNumber);
BBSOracleDao.getInstance().upHit(articleNumber);
} catch (Exception e) {
e.printStackTrace();
}
req.setAttribute("article", article);
req.setAttribute("pageNum", req.getParameter("pageNum"));
return "/content.jsp";
}
}
content.jsp를 생성한 후 아래와 같은 코드를 작성한다. 파일 다운로드나 로그인 유무에 따라 변하는 버튼 기능들은 나중에 사용하기 위해 주석 처리해뒀다. <table>태그 가장 마지막 주석 코드들은 모델 1 구조로 요청을 처리하는 방법이며, 모델 1 구조를 확인하기 위해 지우지 않았다.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>BBS Content</title>
<style>
</style>
</head>
<body>
<form action="/bbs/replyForm.bbs" method="post">
<div align="center">
<input type="hidden" name="pageNum" value="${pageNum}">
<input type="hidden" name="depth" value="${article.depth}">
<input type="hidden" name="pos" value="${article.pos}">
<input type="hidden" name="groupId" value="${article.groupId}">
<table border="2" width="500">
<tr>
<th>글쓴이</th>
<td>${article.id}</td>
<th>조회수</th>
<td>${article.hit}</td>
</tr>
<tr>
<th>제목</th>
<td>${article.title}</td>
<th>날짜</th>
<td>${article.writeDate}</td>
</tr>
<tr>
<th colspan="2">다운로드</th>
<td colspan="2">
<!-- 파일 다운로드 기능 -->
<a href="">${article.fileName}</a>
<%-- <a href="/bbs/download.bbs?fileName=${article.fileName}">${article.fileName}</a> --%>
</td>
</tr>
<tr height="200" valign="top">
<td colspan="4">${article.content}</td>
</tr>
<tr>
<th>첨부</th>
<td colspan="3">
<c:if test="${article.fileName == null}">없음</c:if>
<c:if test="${article.fileName != null}">${article.fileName}</c:if>
</td>
</tr>
<tr>
<td colspan="4" align="right">
<!-- 로그인 검증 -->
<%-- <c:if test="${id != null}">
<input type="submit" value="답글달기">
<c:if test="${id == article.id}">
<input type="button" value="수정하기" onclick="document.location.href='/bbs/updateForm.bbs?articleNum=${article.articleNumber}&pageNum=${pageNum}'">
<input type="button" value="삭제하기" onclick="document.location.href='/bbs/delete.bbs?articleNum=${article.articleNumber}&pageNum=${pageNum}'">
</c:if>
<c:if test="${id != article.id}">
<input type="button" value="수정하기" disabled="disabled">
<input type="button" value="삭제하기" disabled="disabled">
</c:if>
</c:if>
<c:if test="${id == null}">
<input type="submit" value="답글달기" disabled="disabled">
<input type="button" value="수정하기" disabled="disabled">
<input type="button" value="삭제하기" disabled="disabled">
</c:if> --%>
<input type="button" value="목록으로" onclick="document.location.href='/bbs/list.bbs?pageNum=${pageNum}'">
</td>
</tr>
<!-- Model 1 방식, 스트립트릿과 식을 이용한 방법 -->
<!-- 상단부에 BBSDto import 필요 -->
<%-- <%BBSDto article = (BBSDto)request.getAttribute("article"); %>
<tr>
<td>글쓴이 : </td>
<td><%=article.getId() %></td>
</tr>
<tr>
<td>제목 : </td>
<td>
<%=article.getTitle() %>
</td>
</tr>
<tr>
<td colspan="2">
<%=article.getContent() %>
</td>
</tr>
<tr>
<td>첨부 : </td>
<td>
<%if(article.getFileName() != null && !article.getFileName().equals("")) { %>
<%=article.getFileName() %>
<%} else { %>
<span>없음</span>
<%} %>
</td>
</tr> --%>
</table>
</div>
</form>
<script>
</script>
</body>
</html>
이미 만들어져있는 BBSOracleDao클래스에 게시글의 조회수를 증가시키는 메서드를 작성한다.
/**
* BBSOracleDao.java에 추가한다.
* @param articleNumber
* @return int
*/
public synchronized int upHit(String articleNumber) throws ClassNotFoundException, SQLException {
conn = orclDbc.getConnection();
pstmt = conn.prepareStatement("UPDATE bbs SET hit = hit + 1 WHERE article_number = ?");
pstmt.setString(1, articleNumber);
int result = pstmt.executeUpdate();
disconnect();
return result;
}
이제 톰캣을 실행한 뒤 http://localhost/bbs/list.bbs?pageNum=1로 접속하여 게시글 제목 링크를 클릭해보자. list.jsp에서 ${article.hit}가 20 이상될 때 게시글의 제목 옆에 'hit!'를 출력하게 해놓았다.
288번 글을 선택했을 때 해당되는 게시글을 조회하여 화면에 출력해주고, 조회수를 증가시켜준 것을 확인할 수 있다. ContentImpl클래스에서 pageNum 데이터를 다시 content.jsp로 던져주기 때문에, '목록으로' 버튼을 누르면 이 글을 확인한 페이지 번호로 돌아갈 수 있다.
원래는 기능 구현을 끝마치고 부트스트랩(Bootstrap)을 이용해 디자인을 고치려했었다. 그런데 이게 미리 구현해놓은 것을 포스팅하는 것이라 CSS(Cascading Style Sheets) 공부와 겹치는 바람에 다음 글에선 list.jsp에 부트스트랩을 적용하고자 한다.
[[JSP] request 내장 객체 참고]
'Java > web' 카테고리의 다른 글
| [Web] 로그인, 로그아웃 구현하기 (게시판 구현) (0) | 2017.04.11 |
|---|---|
| [Web] 부트스트랩 적용하기 (게시판 구현) (0) | 2017.04.10 |
| [Web] 에러 페이지 처리하기 (게시판 구현) (0) | 2017.04.10 |
| [Web] 페이징 처리하기 (게시판 구현) (2) | 2017.04.07 |
| [Web] 리스트 화면 만들기 (게시판 구현) (0) | 2017.04.06 |