이번에는 form 태그에 action 속성을 주어 method의 GET POST 방식이 어떤 차이가 있나 확인하고
화면에 결과를 띄우는 예이다.
구조는 다음과 같다.
--------- index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1 align="center">My First Web Project</h1>
<!-- action에는 서블릿 주소를 -->
<!-- method get은 정보를 url로 넘긴다. -->
<!-- post의 경우는 한글이 깨지므로 따로 처리를 해야 한다. -->
<form action="/w2/test" method="post">
<table align="center">
<tr>
<td>아이디</td>
<td><input type="text" name="userId"></td>
<td rowspan="2"><button type="submit" style="height: 50px;">로그인</button></td>
</tr>
<tr>
<!-- password 타입은 한글을 지원하지 않는다, 자동으로 영문으로 변경 -->
<td>비밀번호</td>
<td><input type="password" name="password"></td>
</tr>
</table>
</form>
</body>
</html>
post 부분을 get으로 바꿔가며 직접 실행해보자.
--------- TestServlet.java
package controller;
import java.io.IOException;
import java.io.PrintWriter;
import java.io.UnsupportedEncodingException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class TestServlet extends HttpServlet{
public TestServlet() {}
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 한글이 깨지는 경우
/*
System.out.println("잘 왔다");
String userId = request.getParameter("userId");
String password = request.getParameter("password");
System.out.println("ID : " + userId);
System.out.println("Password : " + password);
*/
// 한글 깨짐 방지(throw 필요)
// 1. 전송 값에 한글이 있을 경우 처리할 수 있도록 인코딩 처리를 함
request.setCharacterEncoding("utf-8");
// 보내는 페이지의 <meta charset="UTF-8"> 형식과 같아야함
// 새로 열릴 페이지 역시 utf 8 설정을 위해 아래와 같은 문구를 사용
response.setContentType("text/html; charset=UTF-8");
// 반드시 값을 꺼내오기 전에 명시를 해야함
// 2. view 에서 보낸 전송값을 꺼내서 변수에 저장하기
String userId = request.getParameter("userId");
String password = request.getParameter("password");
System.out.println("ID : " + userId);
System.out.println("Password : " + password);
// 3. 웹페이지에 스트림 연결(throw 필요)
PrintWriter out = response.getWriter();
// 4. 스트림을 통해 출력
out.println("<html>"
+ "<head>"
+ "</head>"
+ "<body>"
+ "아이디 : " + userId + "<br>"
+ "패스워드 : " + password
+ "</body>"
+ "</html>");
out.close();
}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException{
doGet(request, response);
}
}
이번에는 어노테이션을 사용하지 않고 xml을 통해서 mapping을 진행한다.
또한 html 문서를 작성할 때 입력하는 charset utf-8을
java에서는 어떻게 입력하는지 Set Character Encoding 을 찾아 확인해보자.
--------- web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
<display-name>web-02</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>test</servlet-name>
<servlet-class>controller.TestServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>test</servlet-name>
<url-pattern>/test</url-pattern>
</servlet-mapping>
</web-app>
<servlet>
<servlet-name>test</servlet-name>
<servlet-class>controller.TestServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>test</servlet-name>
<url-pattern>/test</url-pattern>
</servlet-mapping>
이 부분이 java와 html이 mapping되는 부분이다. 폴더 구조를 확인하면서 어떻게 쓰였는지 확인해보자.