Notice
Recent Posts
Recent Comments
Link
«   2024/10   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31
Tags
more
Archives
Today
Total
관리 메뉴

wintertreey 님의 블로그

[게시판] 게시판 메인화면 / jsp 액션태그. form 태그 get post 방식 본문

쇼핑몰웹

[게시판] 게시판 메인화면 / jsp 액션태그. form 태그 get post 방식

wintertreey 2024. 6. 30. 23:35

 게시판 코너 가장 처음에 그렸던 다이어그램의 일부이다. 가장 처음으로 게시판 메인화면을 만들어보자.

게시판에 보여줄 글들을 불러오기 위해 자바빈규약으로 jspusebean을 사용한다. 

이 부분을 좀더 자세히 알아보자.


 

jsp 액션태그 

 

https://blog.naver.com/heartflow89/221006593791

 

[JSP] 자바빈 / useBean, setProperty, getProperty

자바빈(Java Bean) 자바빈은 자바(JAVA)로 작성된 컴포넌트를 의미한다. 간단하게 이야기하면 ...

blog.naver.com

https://5bong2-develop.tistory.com/143

 

JSP - 액션 태그(useBean, setProperty, getProperty)

액션 태그 JSP 페이지 내에서 어떤 동작을 지시하는 태그 기능 어떤 동작 또는 액션이 일어나는 시점에 페이지와 페이지 사이에서의 제어 이동 다른 페이지의 실행 결과를 현재 페이지에 포함 종

5bong2-develop.tistory.com

 

자바 빈(JavaBeans)

DTO / VO와 같은 개념

데이터를 다루기 위해 자바로 작성되는 소프트웨어 컴포넌트로 재사용 가능

입력 폼의 데이터와 데이터베이스의 데이터 처리 부분에서 활용

클래스로 만들어짐

 

멤버 필드(변수)로 속성(Property)이 있고 멤버 메소드로 Getter / Setter 메소드 포함

 

setXXX() : 프로퍼티에 값 저장

getXXX() : 프로퍼티 값 반환

 

속성 접근 제어자는 private

Getter / Setter 메소드와 클래스는 public

 

 

<jsp:useBean>

자바 빈을 JSP 페이지에서 사용할 때 사용

<jsp:useBean id="빈 이름" class="클래스" scope="유효범위" />

<jsp:useBean id="student" class="sec01.StudentBean" scope="page" />

 

id : 자바빈 이름

class : 패키지명을 포함한 클래스 이름

scope : 자바빈의 유효 범위

page : 생성된 페이지 내에서만 사용 가능. (디폴트)

request : 요청이 수행되는 페이지에서만 사용 가능

session : 객체가 생성된 세션에서 수행되는 페이지에서 사용 웹 브라우저의 생명주기와 동일하게 사용 가능

application : 객체가 생성된 애플리케이션에 포함된 페이지에서 사용 웹 애플리케이션 생명주기와 동일하게 사용 가능

 

<jsp:setProperty>

프로퍼티(변수) 값을 세팅할 때 사용 (setter)

데이터 저장

<jsp:setProperty name=”빈 이름” property=”속성이름” value=”속성값” />

<jsp:setProperty name=”student” property=stdNo value=2021001 />

 

<jsp:getProperty>

프로퍼티(변수) 값을 얻어올 때 사용 (getter)

<jsp:getProperty name=”빈 이름” property=”속성이름”>

<jsp:getProperty name=”student” property=”stdNo”>

 


게시판 메인 화면 Boardlist.jsp

 

db에 저장된 값을 불러오기에 jspusebean으로 dto를 사용.

 

페이징 처리, 검색어 처리.

댓글들여쓰기 공백.

<%@page import="pack.board.BoardDto"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:useBean id="boardMgr" class="pack.board.BoardMgr"/>
<jsp:useBean id="dto" class="pack.board.BoardDto"/>

<%
int spage =1, pageSu=0;
int star, end; // 페이지블럭소스코도. https://cafe.daum.net/flowlife/HqLp/13 코드참조
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>게시판</title>
<link rel="stylesheet" type="text/css" href="../css/board.css">
<script type="text/javascript">
window.onload = () => { // 글제목, 작성자를 찾는 검색버튼 함수
	document.querySelector("#btnSearch").onclick = function(){
		if(frm.sword.value === ""){
			frm.sword.focus();
			frm.sword.placeholder = "검색어를 입력하세요";
			return;
		}
		frm.submit();
	}
}
</script>
</head>
<body>
<table> <!-- 상단의 메뉴 테이블 -->
	<tr>
	<td>
	<a href="../guest/guest_index.jsp">메인으로</a>&nbsp;
	<a href="boardlist.jsp?page=1">최근목록</a>&nbsp;
	<!-- 가장 최근목록을 보여주어야하기에 페이지쪽수까지 지정.-->
	<a href="boardwrite.jsp">새글작성</a>&nbsp;
	<a href="#" onclick="window.open('admin.jsp', '', 'width=300,height=150,top=200,left=300')">관리자용</a>&nbsp;
	<br><br>
	<table style="width:100%">
	<tr style="background-color: silver;">
	<th>번호</th><th>제  목</th><th>작성자</th><th>작성일</th><th>조회수</th>
	</tr>
	<%
	try{
		spage= Integer.parseInt(request.getParameter("page"));
	}catch(Exception e){
		spage=1;
	}
	if(spage<=0) spage=1;
	
	//검색
	String stype= request.getParameter("stype");
	String sword= request.getParameter("sword");
	
	// 페이징처리
	boardMgr.totalList(); //전체레코드수 계산
	pageSu = boardMgr.getPageSu(); //전체페이지수 얻기
	
	ArrayList<BoardDto> list = boardMgr.getDataAll(spage, stype, sword); //페이징처리랑 검색처리
	
	
	for(int i=0; i<list.size(); i++){
		dto= (BoardDto)list.get(i);
		
		// 댓글 들여쓰기
		int nst= dto.getNested();
		String tab = "";
		for(int b=0; b<nst; b++){
			tab += "&nbsp;&nbsp;";
		}
	%>	
	<tr>
	<td><%=dto.getNum() %></td>
	<td><!-- 댓글1개마다 2칸공백. 대댓글이면 4칸공백. -->
	<%=tab %><a href="boardcontent.jsp?num=<%=dto.getNum() %>&page=<%=spage %>"><%=dto.getTitle() %></a> 
	</td> <!-- 해당 게시글이 있던 페이지로 돌아와야하기에, 해당 페이지값도 같이 가지고간다 -->
	<td><%=dto.getName() %></td>
	<td><%=dto.getBdate() %></td>
	<td><%=dto.getReadcnt() %></td>
	</tr>
	<%
	}
	%>
	</table>
	<br>
	<table style="width: 100%">
	<tr>
	<td style="text-align: center;">
	<%
	for(int i=1; i <= pageSu; i++){
		if(i==spage){ //선택페이지. 캡쳐화면에선 [1]
			out.print("<b style='font-size:12pt;color:red'>[" +i + "]</b>");
		}else{ //선택되지 않은 페이지. 캡쳐화면에선 [2][3]
			out.print("<a href='boardlist.jsp?page=" +i + "'>[" +i + "]</a>");
		}
	}
	%>		
	<br><br>
	<form action="boardlist.jsp" name="frm" method="get">
		<select name="stype">
		<option value="title" selected="selected">글제목</option>
		<option value="name">작성자</option>
		</select>
		<input type="text" name="sword">
		<input type="button" value="검색" id="btnSearch">
	</form>
	</td>
	</tr>
	</table>
	</td>
	</tr>
</table>
</body>
</html>

 

관련 메소드를 모아둔 Mgr 

public void totalList() { //전체 레코드 수 구하기
		String sql= "select count(*) from board";
		
		try {
			conn= ds.getConnection();
			pstmt= conn.prepareStatement(sql);
			rs = pstmt.executeQuery();
			rs.next();
			recTot= rs.getInt(1);
			System.out.println("전체레코드수: "+ recTot);
		} catch (Exception e) {
			System.out.println("totalList err: "+e);
		}finally {
			try {
				if(rs != null) rs.close();
				if(pstmt != null) pstmt.close();
				if(conn != null) conn.close();
			} catch (Exception e2) {
				
			}
		}
	}
    public int getPageSu() { //전체 페이지 수 반환
		pageSu=recTot/ pList;
		if(recTot % pList >0) pageSu++;
		return pageSu;
	}
	
   public ArrayList<BoardDto> getDataAll(int page, String stype, String sword){ //반환값 배열묶음	
		ArrayList<BoardDto> list = new ArrayList<BoardDto>();
		
		String sql = "select * from board"; //order by gnum desc, onum asc
		try {
			conn = ds.getConnection();
			
			if(sword== null) { //검색이 없는경우
				sql += " order by gnum desc, onum asc";
				pstmt= conn.prepareStatement(sql);
			}else { //검색이 있는 경우
				sql += " where "+stype+ " like ?";
				sql += " order by gnum desc, onum asc";
				pstmt= conn.prepareStatement(sql);
				pstmt.setString(1, "%"+sword+"%");
			}
			
			
			rs= pstmt.executeQuery();
			
			//페이징처리
			for(int i=0; i< (page-1)* pList; i++) {
				rs.next(); //레코드 포인터 이동 0, 4, 9, 14, 19..
			}
			
			int k =0;
			while(rs.next()&& k<pList) {
				BoardDto dto =new BoardDto();
				dto.setNum(rs.getInt("num"));
				dto.setName(rs.getString("name"));
				dto.setTitle(rs.getString("title"));
				dto.setBdate(rs.getString("bdate"));
				dto.setReadcnt(rs.getInt("readcnt"));
				dto.setNested(rs.getInt("nested"));
				list.add(dto);
				k++;
				
				
			}
		} catch (Exception e) {
			System.out.println("getDataAll() err:"+e);
		}finally {
			try {
				if(rs != null) rs.close();
				if(pstmt != null) pstmt.close();
				if(conn != null) conn.close();
			} catch (Exception e2) {
				// TODO: handle exception
			}
		}
		return list;
	}

 


 

코드 하단에 form 태그가 적혀있다. get 방식은 해당 값들이 쿼리스트링으로 url에 뜬다는것, post 는 뜨지 않아 보안에 유리하다는 것까지는 알고있다.

그렇다면 보안적 측면에서 post 로 통일하면 되는데 굳이 get 방식을 쓰는 이유는?

post는 그럼 어떤 방식으로 값을 전달하는걸까?

 

https://velog.io/@quddnr005/Form-%ED%83%9C%EA%B7%B8-GET-%EA%B3%BC-POST

 

Form 태그 GET 과 POST

웹양식을 만드는 데 사용하는 태그• action : 사용자가 입력한 데이터를 받아 처리하기 위한 웹 프로그램(ASP, PHP, JSP… 등)의 페이지 지정• method : 웹 서버와 클라이언트 간의 통신 방법 지정(GET

velog.io

 

 

Form 이란?


폼이란 사용자의 데이터를 서버에 전송하는 방법

 

로그인을 위해서 아이디/비밀번호를 입력할 때

회원가입을 하기 위해서 개인정보를 입력할 때

블로그나 게시판에 글을 작성하거나, 파일을 전송할 때

이럴때 사용한다. 

 

GET 방식

URL 뒤에 파라미터를 붙여서 데이터를 전달하는 방식

사용자가 보내는 데이터는 이름과 값이 결합된 문자열 형태로 전달, 각 이름과
값의 쌍은 ‘&’ 기호로 구분

서버로 보낼 수 있는 최대 글자수는 2,048자

URL을 보면 어떤 데이터를 전송하고자 하는지 알 수 있기 때문에 보안에 취약

 

POST방식

HTTP Request 헤더에 파라미터를 붙여서 데이터를 전송하는 방식

서버로 보낼 수 있는 글자수 제한 없음

GET 방식과 비교하여 보안상 우위에 있음

 

 

https://build-enough.tistory.com/87

 

GET방식 / POST 방식

GET 주로 데이터를 읽거나(Read) 검색(Retrieve)할 때에 사용되는 메소드 클라이언트에서 서버로 어떠한 리소스로 부터 정보를 요청하기 위해 사용되는 메소드 만약 GET요청이 성공적으로 이루어진다

build-enough.tistory.com

 

 

GET: 어떤 데이터를 가져와서 보여준다거나 하는 용도로 서버의 값이나 상태를 바꾸는 것은 아님

POST: 서버의 값이나 상태를 바꾸기 위해 사용됨, 예를 들어 글을 쓰면 글의 내용이 DB에 저장되고 수정하면 DB값이 수정되는데 이럴 경우 POST 사용