현 블로그는 모바일 환경이 아닌 PC환경에 최적화 되어있습니다.

 Mir의 운영환경



이전 Chapter에서 우리는 get방식의 전송을 사용하여 서블릿을 완성시켜 보았다.
이번 Chapter에서는 post방식을 한번 사용해보자. 


post방식이나 get방식이나 서블릿에서 사용할때에는 크게 다른점은 없다.
다만 post방식을 사용했을때에 조금더 보안성이 생기고 편리한 점이 하나더 생긴다는것 정도의 이점이 있다.

자 그럼 우선 html파일을 만들기 전에 잠시 현재 우리가 만드는 웹페이지의 구조를 한번 생각해보자.

우리가 처음에 만드는 html파일은 값을 입력받기 위한 페이지이다.
즉 Client가 값을 전송하기 위한 페이지로써 클라이언트가 볼수 있게 즉 Browser가 해석할수 있는 언어인 html로 만들어진다.
Browser는 즉 웹이라고 표현해도 무방할것이다. 그 Html파일을 웹에서 Client가 보고 form을 이용 하여
Data를 입력후 서버로 전송(get또는 post방식으로)을 하게 된다.


자 위의 그림을 보면서 더 설명해보자.
Client는 웹에서 post나 get방식으로 서버로 Data를 전송하며 Service를 요청(Request)하게 된다,
(post나 get방식으로 보내는 Data를 Parameter라고 부른다.) 
그럼 서버에서는 servlet을 이용하여 Data를 받고 Logic를 구현하여 Service를 실행한 뒤에
출력값 즉 응답(Response)을 다시 웹으로 전송하게 된다.
이때 전송하는 응답은 모두 Browser에서 해석할수 있는 언어인 html등으로 전송이 된다.

위 구조를 기억해두기 바란다.
앞으로 점점 저 구조가 바뀌고 추가되면서 MVC구조 혹은 Struts구조 등등으로 변하게 되는것이다.

가장 기본되는 구조 Client와 Server의 구조부터 시작해서 차근차근 이해를 하고 넘어가면
후에 복잡한 구조의 웹페이지라도 쉽게 해석이 가능할것이다.


자 그럼 이제 프로그램을 짜기전에 어떤 웹 프로그램을 짜볼지 생각해보자.
이전 파트에서는 아이디와 이름을 전송하여 출력하는 웹 프로그램을 짜보았다.

이번엔 조금만 더 복잡하게 이름과 성별 그리고 취미를 전송하여서
xxx님의 취미는 x , x, x입니다.
혹은 xxx님의 취미는 x , x입니다.
xxx님의 취미는 없습니다.


이런식으로 취미를 선택하기에 따라 다르게 출력되도록 만들어보자.
 

그럼 우선 html파일을 만들어보자.
이번에는 text폼으로 이름, 라디오 버튼으로 성별, 채크박스로 취미를 전송하는 html파일을 만들어야 한다. 

아래 완성된 소스를 보기전에 우선은 각자 한번 djoin.html을 만들어 보도록 하자.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

</head>


<body>

<form method="post" name="fruit" action="servlet/FruitTest" >

<table >

  <tr>

    <td>이름</td>

    <td><input type="text" name="name"  /></td>

  </tr>

  <tr>

    <td>성별</td>

    <td><input type="radio" name="gender" value="m" />

    <input type="radio" name="gender" value="wm" /></td>

  </tr>

  <tr>

    <td colspan="2">취미</td>

  </tr>

  <tr>

    <td colspan="2">

    <input type="checkbox" name="fruit" value="게임"/>게임

    <input type="checkbox" name="fruit" value="독서"/>독서

    <input type="checkbox" name="fruit" value="영화감상"/>영화감상

    <input type="checkbox" name="fruit" value="음악감상"/>음악감상

</td>

  </tr>

  <tr>

    <td  colspan="2"><input type="submit" value="전송"/>

    <input type="reset" value="취소"/></td>

    <td>&nbsp;</td>

  </tr>

  

</table>

</form>

</body>

</html>

자 djoin.html을 완성시켰다.
우선 톰켓폴더의 webapps / ROOT 폴더에 넣은뒤 제대로 나타나는지 확인을 해보자.
이클립스와 톰켓을 연동해놓은 상태라면 그냥 html을 실행하면 될것이다.


이런식으로 나오면 된다.

자 그럼 이제 서블릿을 만들어보자.

자 이전챕터에서 말했듯이 HttpServlet을 상속받을 것이다.
HttpServlet은 의미상의 추상클래스라서 HttpServlet클래스에 속한 메소드중 하나는 꼭 구현해야 된다고 말했었다.

이번엔 post전송방식을 사용하고 있으니 doPost( )메소드를 구현해보자.


import javax.servlet.http.HttpServlet;



public class DJoin extends HttpServlet{


public void doPost(HttpServletRequest req, HttpServletResponse res)

throws IOException, ServletException{

}

자 첫번째 Data get !

데이터를 가지고 올때 한글로 입력된 데이터는 오다가 Charset이 바뀌기 때문에 깨진다고 했었다.
그래서 byte단위로 다시 나누고 난뒤 utf-8로 재조립 하는 과정을 배워보았었다.
그리고 필자가 3줄로 된 명령어를 한줄로 바꿔보라고 했었는데 아래와 같이 바꾸면 된다.

String name = req.getParameter("name");

byte[] b = name.getBytes("ISO-8859-1");

name = new String(b, "UTF-8");

자 위의 소스를 한번 풀어보도록 하자
new String( b, "UTF-8")을 보면  b = name.getBytes("ISO-8859-1")으로 변경이 가능하다.
그리고 name 또한 req.getParameter("name")으로 변경된다.

자 그럼 이것을 조합하면 
String name = new String(req.getParameter("name").getBytes("ISO-8859-1"), "UTF-8");
처럼 한줄로 바꿀수 있다.

자 그럼 전송된 Data를 받아보도록 하자.

String name = new String(req.getParameter("name").getBytes("ISO-8859-1"), "UTF-8");

String gender = req.getParameter("gender");

String fruit = new String(req.getParameter("fruit").getBytes("ISO-8859-1"), "UTF-8");

gender같은 경우는 m혹은 wm으로 값을 보내기 때문에 굳이 UTF-8로 인코딩 해줄필요가 없다.
(원래 취미가 아닌 좋아하는 과일이여서 변수 이름이 fruit이다;;아무생각 안하고 쓰다가 고치기 귀찮아서 그냥 놔두기로 했다;)

자 Logic을 짜기전에 하나만 더 짚고 넘어가자.
위와 같이 변수를 하나하나 한글로 변경해주기 너무 힘들다.

여기서 post 전송방식의 편리한 점이 하나 있는데 post전송방식은 내부의 소스를 이용하여 전송이 되기때문에
전송을 하는 도중setCharacterEncoding( )메소드를 통해 바로 한글로 변경해줄수 있다. 

하지만 get전송방식은 페이지가 이동한후에 url을 읽어서 Data얻는 방식이라서 어쩔수 없이 하나하나 변경해주어야 한다.
그나마 최선을 다해 줄일려면 한글로 변경해주는 메소드를 하나 만들어서 사용하던지 해야할것이다.

자 그럼 setCharacterEncoding( )메소드를 한번 사용해보자.

req.setCharacterEncoding("UTF-8");

String name = req.getParameter("name");

String gender = req.getParameter("gender");

String fruit = req.getParameter("fruit");

아.. 생각해보니 코드를 다 작성하고 말했으면 바로 적용해볼텐데 잘못 생각했다.
다들 코드를 완성한후에 한번씩 실험해보도록 하자 ;;;

아무튼 복잡해보였던 소스가 정말 간단히 된것을 확인할수 있다.


자 그다음 두번째  Logic을 짜보도록하자.
xxx님의 취미는 x , x, x입니다.
xxx님의 취미는 없습니다.
처럼 선택한 취미를 출력하고 선택한 취미가 없을때는  없습니다. 를 출력하면된다.

간단한 if문으로 fruit의 값이 있을때에는 출력해주고 없을때에는 출력 안해주는 Logic를 짜주면 된다.

String msg = "";

if(fruit==null){

msg = name+"님의 취미는 없습니다."

}else{

msg = name+"님의 취미는"+fruit+"입니다.";

}

자 여기서 가만히 생각해보니 취미는 하나를 전송할수도 있지만 여러개를 전송할수도 있다.
그럼 값을 받을때 배열로 받아야 한다.
String[] fruit = res.getParameter("fruit")
그런데 위처럼 fruit를 배열로 선언을 했더니 오류가 발생한다.
이유는 getParameter( ) 메소드는 String값을 가져와서 변수에 저장을 시켜주는데
배열로 선언한 fruit는 String형의 값이 들어가는게 아니라 참조변수가 들어가야한다.

그래서 getParameterValues( )란 메소드를 사용하여 값을 받아올때 배열처럼 받아와서
그 배열의 주소값을 넘겨줘야 하는것이다.

String[] fruit = req.getParameterValues("fruit");


자 그럼 위의 if문을 한번더 바꿔보자.

String msg = "";

if(fruit==null){

msg = name+"님의 취미는 없습니다."

}else{

msg = name+"님의 취미는";

for(int i=0; i<fruit.length; i++){

msg += fruit[i]+", ";

}

msg += "입니다.";

}

이렇게 Logic를 꾸미면 fruit값이 있을때 for문으로 fruit배열안의 모든 변수를 msg에 더해줄것이다.

자 그럼 마지막으로 응답처리를 한뒤에 msg를 출력시켜주자.

import java.io.IOException;

import java.io.PrintWriter;


import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;



public class DJoin extends HttpServlet{


public void doPost(HttpServletRequest req, HttpServletResponse res)

throws IOException, ServletException{

req.setCharacterEncoding("UTF-8");

String name = req.getParameter("name");

String gender = req.getParameter("gender");

String[] fruit = req.getParameterValues("fruit");

String msg = "";

if(fruit==null){

msg = name+"님의 취미는 없습니다."

}else{

msg = name+"님의 취미는";

for(int i=0; i<fruit.length; i++){

msg += fruit[i]+" ";

}

msg += "입니다.";

}

res.setContentType("text/html; charset=utf-8");

PrintWriter out = res.getWriter();

out.println("<html>");

out.println("<body>");

out.println(msg);

out.println("</body>");

out.println("</html>");

}

}



자 html을 실행시키고 난뒤 이름과 성별 취미를 입력후 똑바로 출력되는지 확인해보자.

그리고 난뒤 gender변수를 이용하여 남자면 글씨가 파란색 여자면 글씨가 빨간색으로 나오게도 한번 만들어보자.


자 이번챕터까지 서블릿에 대해 알아보고 서블릿을 만들어보았다.
다음 챕터에는 이제 이클립스를 이용하여 좀더 쉽게 서블릿을 만드는 방법을 알아보자.


 







 

+ Recent posts