본문 바로가기
Lecture/JSP & Java

[본격 게시판짜기 Part1.8 JSP 게시글 조회] 게시글 조회기능 및 게시글 삭제

by cusmaker 2012. 7. 8.
반응형

2012/06/13 - [Lecture/HTML] - [본격 게시판짜기 Part1.1 - 게시판도 HTML부터] 게시글 리스트

2012/06/13 - [Lecture/HTML] - [본격 게시판짜기 Part1.2 - 게시판도 HTML부터] 글입력폼

2012/06/13 - [Lecture/Javascript-기초] - [본격 게시판짜기 Part1.3 - Dom 맛보기 ] 글입력폼 검사

2012/06/13 - [Lecture/Jsp] - [본격 게시판짜기 Part1.4 - HTML-> JSP] form 파라미터 받기

2012/06/26 - [Lecture/SQL / Oracle] - [본격 게시판짜기 Part1.5 JSP > Oracle] 게시판 DB 테이블 생성

2012/06/26 - [Lecture/Jsp] - [본격 게시판짜기 Part1.6 Oracle > JSP] Database 접속 및 Select

2012/07/05 - [Lecture/Jsp] - [본격 게시판짜기 Part1.7 JSP, SQLDeveloper] 게시글 입력 및 리스트조회기능


안녕하세요 cocy입니다.

이번시간에는 게시글 조회기능 및 삭제기능을 만들어 보겠습니다.


일단 리스트에서 제목에 링크를 걸고,

게시글 조회로 이동하기전에 생각해봅시다.

게시글 제목에 해당하는 글의 내용을 가져오려면 어떤 정보들이 파라미터로 넘어가야할까요?

그러기 위해선 해당 게시글을 가져오는 쿼리를 생각해 보면 됩니다.


1
select from board where idx = #넘어온 파라미터#


해당 글번호만 있으면 되겠네요!

그렇다면 이제 수정에 들어갑시다.


out.print("<td>" + rs.getString(1) + "</td>"); 


index.jsp에서 찾아보면 글번호를 표시해 주는 코드입니다. 

그렇다면 여기서 rs.getString(1)가 글번호에 해당하는 레코드 값임을 알 수 있습니다.

가독성이 떨어지죠? 다음과 같은 형식으로도 가능합니다.

rs.getString("컬럼명")

그럼 제목에 링크를 걸어 글번호를 넘겨보도록 합시다.


out.print("<td>" + rs.getString("title") + "</td>");


제목에 해당하는 코드입니다. 여기서 td 태그안에 a태그를 넣습니다.


out.print("<td> <a href='content.jsp'>" + rs.getString("title") + " </a></td>");

그런데 이렇게 되면 글번호를 넘길 수가 없습니다. 

폼테그를 사용하는 것도 아니고, 어떻게 해야 글번호를 넘길 수 있을까요?

여기서 GET방식이 등장합니다.


GET방식은 URL에 파라미터를 넘기는 방식으로 URL의 끝에 "?"를 추가하고

name=value 형식으로 추가되며 두개이상은 &를 붙여 

?name=value&name=value&name=value.... 로 다수의 파라미터를 넘길 수 있습니다.


그럼 직접 해당 방식을 적용해보면 

content.jsp?idx=#글번호#

가 되겠습니다. 여기서 name은 변수명이라고 생각하시면 되는데, 보통 일치시켜 작업합니다.

코드에 적용하려면 다음과같이 적어줍니다.

out.print("<td> <a href='content.jsp?idx="+ rs.getString("idx") +"'>" + rs.getString("title") + " </a></td>");


정상적으로 작동하는지 확인하시구요,

404에러를 확인하셨으면 content.jsp페이지를 만들어줍시다. (빠른작업을 위해 index.jsp 복붙 !!)


그럼 글내용 조회페이지에서 필요한 부분은 

넘어온 글번호 파라미터를 받아오고,

db 커넥션을 한뒤

sql에 해당 파라미터로 select 쿼리를 만들어준뒤,

해당 게시글을 표시할 HTML파트가 있겟내요 

소스를 작성하신다면 다음과 같겠습니다. 한번 작업해보시고 비교해보세요.




전체 소스코드입니다.

손수 짜보신 코드와 비슷한가요? 복붙 안하시고 직접 짜보셨길 바랍니다.





이제 마지막으로 삭제기능만 남았는데요.

마찬가지로 삭제에도 글조회와 마찬가지로 글번호만을 파라미터로 넘기면 삭제가 가능하겠죠?

코드를 죽 보시면 다음의 코드가 눈에 들어 오실겁니다.


<a href="delete.jsp?idx=<%=rs.getString("idx")%>">게시글삭제</a>


바로 delete.jsp 페이지를 만들어줍니다.

기능상 content.jsp페이지와 가장 유사하니 복붙을 권장합니다;

delete.jsp페이지의 기능을 간추려보면 우선


삭제할 게시글의 번호를 파라미터로 받고

DB 연결 후 delete쿼리를 작성하여 해당 게시글을 삭제한뒤,

리스트페이지로 돌아갑니다.


코드는 다음과 같습니다. 꼭 직접 짜보시고 비교해보시기 바랍니다.



잘 작동 하시나요?


그런데 여기서 문제점이 하나 발생합니다.

직접 해보시면 아시겠지만,

바로 해당 작업이 끝난뒤에 사용자가 뒤로가기를 호출했을 경우의 문제점입니다.


상식적으로 생각해보면 사용자가 삭제후 뒤로가기를 눌렀을때 

delete연산이 실행되는페이지를 호출하게되고, 해당 작업이 다시한번 수행되게 됩니다.

이를 막기위해 중간단계의 페이지를 추가하고, 다시 해당작업이 수행될 수 없게끔 해주는데요,


이를 redirect 페이지라고 합니다.

구체적으로 설명하면 delete.jsp작업이 끝나면 바로 index.jsp페이지를 호출하는 것이 아니라

중간 매개 역할을 하는 페이지를 거치도록 페이지를 추가합니다.

이 역할을 할 페이지를 redirect.jsp라 칭하고 추가하겠습니다.

redirect.jsp페이지의 기능은 단순 index.jsp페이지로 이동하는것입니다.

코드는 다음과 같습니다


<script>location.href="index.jsp"; </script>


그럼 delete.jsp페이지에서도 수정해줘야겠죠?


<script>

alert("게시글이 삭제되었습니다"); // 게시글이 삭제되었다는 경고창을 띄워주고

location.href="redirect.jsp"; // 리스트페이지로 이동합니다.

</script>


이상으로 Model1 게시판이 끝났습니다.


뭔가 부족하다고 생각하시는분들은 부족한게 맞습니다.

count변수를 추가했지만 제기능을 하지 않고 있으며,

부족한 컬럼들도 많이 있고, 

보안적인 측면이나

성능적인 측면에서

고려되지않은 부분들이 많습니다.


그리고 무엇보다 model1방식의 게시판에서는

소스의 가독성이나, 팀으로 작업할 경우 작업의 분업이 원할 하지 못합니다.

그렇기때문에 model2라고 하는 방식이 생겨났는데요,





이것은 java의 디자인패턴중 하나로

※ 디자인패턴에 대해 공부해보시기바랍니다.

우리가 여지껏 구현했던 소스들을


Model(데이터베이스와 접속을 관리(트랜젝션제어)하고 sql을 제어하는 데이터베이스와 관련된부분)과

View(Model에서 가져온 데이터들이 화면에 표시되는 부분)와

Controller(URL처리 및 파라미터, 기능제어) 부분들을 나누어 각 파트별로 개발을 하게 됩니다.


이를 MVC패턴(Model2방식) 이라고 합니다. 

이 패턴은 웹어플리케이션 개발 뿐만아니라 여러 개발환경에서 쓰이고 있는데요,


MVC패턴 방식의 개발방법은 많은 이점이 있기때문입니다. 간단히 살펴보자면 


- 유지보수가 편해집니다.

- 테스트가 쉬워집니다.

- 분업이 용이해집니다.


그리고 각 파트별로 지원되는 라이브러리들이 많이 존재하여 보다 풍부한 사용자경험(UX)과 화려한 인터페이스(UI)를 가진

Rich Internet Application(RIA)의 개발이 가능해집니다.


말은 거창하지만 사용자에게 있어서는 디자인을 제대로 못하면 결과물은 똑같아보일지언정

실상 개발자들이 편하기 위한 일종의 개발 패러다임의 변신(?)입니다.


그럼 다음시간부터는 Model2기반 MVC패턴을 활용한 게시판 만들기에 들어가 보도록 하겠습니다.


수고하셨습니다.


다음장으로 >> http://cusmaker.tistory.com/83