관리 메뉴

개발 노트

9/2 Servlet, web setting의 get과 post, JSP 시작 본문

프로젝트 기반 JAVA 응용 SW개발 : 22.07.19~23.01.20/Servlet, JSP

9/2 Servlet, web setting의 get과 post, JSP 시작

hayoung.dev 2022. 9. 12. 16:06

board.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	function chk() {
		if (!frm.title.value) {
			alert("제목은 ?");
			frm.title.focus();
			return false;
		}
		if (!frm.writer.value) {
			alert("작성자 ?");
			frm.writer.focus();
			return false;
		}
		if (!frm.content.value) {
			alert("내용은 ?");
			frm.content.focus();
			return false;
		}
		return true;
	}
</script>
</head>
<body>
	<h1>게시판</h1>
	<form action="Board" name="frm" method="post" onsubmit="return chk()">
		<table border="1">
			<tr>
				<td>제목</td>
				<td><input type="text" name="title"></td>
			</tr>
			<tr>
				<td>작성자</td>
				<td><input type="text" name="writer"></td>
			</tr>
			<tr>
				<td>내용</td>
				<td><textarea cols="40" rows="10" name="content"></textarea></td>
			</tr>
			<tr>
				<td colspan="100"><input type="submit" value="완료"></td>
			</tr>
		</table>
	</form>

</body>
</html>

 

Board.java

package och01;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.Date;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Board
 */
@WebServlet("/Board")
public class Board extends HttpServlet {
	private static final long serialVersionUID = 1L;

	/**
	 * @see HttpServlet#HttpServlet()
	 */
	public Board() {
		super();
		// TODO Auto-generated constructor stub
	}

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
	 *      response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		// TODO Auto-generated method stub
		request.setCharacterEncoding("utf-8");
		String title = request.getParameter("title");
		String writer = request.getParameter("writer");
		String content = request.getParameter("content");
		Date date = new Date();
		response.setContentType("text/html;charset=utf-8");

		PrintWriter out = response.getWriter();
		out.print("<html><body><h1>게시판</h1>");
		out.println("제목 : " + title + "<p>");
		out.println("제목 : " + writer + "<p>");
		out.println("제목 : " + date + "<p>");
		// pre는 있는 그대로 보여주는 것.
		out.println("내용 <br><pre>" + content + "</pre>");
		out.println("</body></html>");
		out.close();
	}
}

 

출력 결과

 

(중요 : 아주 중요함. 면접에 꼭 나옴. 별 5개. 교재에도 설명 있음)

Web Setting

  Get Post
기본 기본 설정 정의해야 함
전달할 수 있는 파라미터의 size 대략 4K 무한대
전달할 때  url + ? + 파라미터 = 변수값 Body 안에 숨겨서
Data 형식 Text Text, 이미지 오디오 등등의 binary 코드

 

[och02]

color.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>좋아하는 색을 선택하세요</h1>
<form action="Color">
	빨강<input type="radio" value="red"    name="color" checked="checked"><br>
	주황<input type="radio" value="orange" name="color"><br>
	노랑<input type="radio" value="yellow" name="color"><br>
	초록<input type="radio" value="green"  name="color"><br>
	파랑<input type="radio" value="blue"   name="color"><br>
	남색<input type="radio" value="navy"   name="color"><br>
	보라<input type="radio" value="violet" name="color"><p>
	   <input type="submit" value="선택완료"><br>
</form>
</body>
</html>

 

Color.java

package och02;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Color
 */
@WebServlet("/Color")
public class Color extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public Color() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String color = request.getParameter("color");		
		PrintWriter out = response.getWriter();
		out.printf("<html><body bgcolor=%s>", color);
		out.println("</body></html>");
		out.close();

	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
	}

}

 

출력 결과

(선택완료 눌렀을 때)

 

name.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function chk() {
	if (!frm.name.value) {	
		alert("이름이 뭐예요?");
		frm.name.focus();	
		return false;
	}
	if (!frm.addr.value) {	
		alert("어디 사시나요 ?");
		frm.addr.focus();	
		return false;
	}
	return true;
}


</script>
</head>
<body>
<form action="Name" name="frm" onsubmit="return chk()" >
	이름 : <input type="text" name="name" ><p>
	주소 : <input type="text" name="addr"><p>
	<input type="submit" value="입력완료">
</form>

</body>
</html>

Name.java

package och02;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Name
 */
@WebServlet("/Name")
public class Name extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public Name() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String name = request.getParameter("name");
		String addr = request.getParameter("addr");
		response.setContentType("text/html;charset=utf-8");
		
		PrintWriter out = response.getWriter();
		out.print("<html><body>");
		out.printf("%s님은 ", name);
		out.printf("%s에 사시는군요", addr);
		out.println("</body></html>");
		out.close();


	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
	}

}

 

출력 결과

(입력완료 눌렀을 때)

num.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript">
function chk() {
	if (!frm.num1.value) {	        
		alert("첫번째 숫자 입력 하세요 ?");
		frm.num1.focus();	
		return false;		
		}
	if (isNaN(frm.num1.value)) {	
		alert("숫자가 뭔지 몰라요! 헐 ?");
		frm.num1.focus();			
		frm.num1.value = "";  
		return false;		
		}
	if (!frm.num2.value) {	
		alert("두번째 숫자 입력 하세요 ?");
		frm.num2.focus();	
		return false;		
		}
	if (isNaN(frm.num2.value)) {	
		alert("숫자가 뭔지 몰라요! 헐 ?");
		frm.num2.focus();			
		frm.num2.value = "";  
		return false;		
		}
	return true;
}

</script>
<body>
<h1>연산할 두 숫자를 입력하세요</h1>
<form action="Num" name="frm" onsubmit="return chk()">
	첫번째 숫자 : <input type="text" name="num1"><p>
	두번째 숫자 : <input type="text" name="num2"><p>
	<input type="submit" value="확인">
</form>
</body>
</html>

 

Num.java

package och02;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Num
 */
@WebServlet("/Num")
public class Num extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public Num() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		int num1 = Integer.parseInt(request.getParameter("num1"));
		int num2 = Integer.parseInt(request.getParameter("num2"));
		//나눌 때 소수점이 나올 수 있으므로 float을 해주는 것이 좋다.
		float num3 = (float)num1/num2;
		
		response.setContentType("text/html;charset=utf-8");
		PrintWriter out = response.getWriter();
		out.print("<html><body>");
		out.printf("덧셈 : %d + %d = %d<br>", num1, num2,(num1+num2));
		out.printf("뺄셈 : %d - %d = %d<br>", num1, num2,(num1-num2));
		out.printf("곱셈 : %d * %d = %d<br>", num1, num2,(num1*num2));
		out.printf("나눗셈 : %d / %d = %f<br>", num1, num2, num3);		
		out.println("</body></html>");
		out.close();
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
	}

}

 

출력 결과

 

personal.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	function chk() {
		var chkbox = document.getElementsByName('notice'); 
		var chk = false; 
		
       if (!frm.name.value) {
			alert("이름 ?");
			frm.name.focus();
			return false;
		}
		if (!frm.id.value) {
			alert("아이디 ?");
			frm.id.focus();
			return false;
		}
		if (!frm.password.value) {
			alert("암호 ?");
			frm.password.focus();
			return false;
		}
	
/* 		if  (!frm.notice.value) {
			alert("메일 수신을 선택해주세요");
			frm.notice.focus();
			return false;
		 }
 */
   		/* notice가 여러개이므로 배열로 들어가게 된다. */
 		for(var i=0 ; i< chkbox.length; i++) { 
			if(chkbox[i].checked)	{
				chk = true; 
				break;
			}
			else chk = false;
		}
        if (chk)  {
        	return true;
        }
        else      {
        	alert("메일수신 하나도 없어");
       		return false;
        }	
        
        
	}




</script>
</head>
<body>
<h2>개인정보  (중요 : 별 3개) </h2>
	<form action="Person" method="post" name="frm" onsubmit="return chk()">
		<table border="1" bgcolor="yellow">
			<tr><td>이름</td>	   <td><input type="text" name="name"></td></tr>
			<tr><td>아이디</td>  <td><input type="text" name="id"></td></tr>
			<tr><td>암호</td>   <td><input type="password" name="password"></td>	</tr>
			<tr><td>성별</td>
			    <td>남자<input type="radio" name="gender" checked="checked" value="남자"><br>
			        여자<input type="radio" name="gender" 	               value="여자"></td>
			</tr>
			<tr>	<td>메일 수신</td>
			    	<td>공지<input type="checkbox" name="notice" value="공지"><br>
				       광고<input  type="checkbox" name="notice" value="광고"><br>
				       배송<input type="checkbox" name="notice" value="배송"><br></td>
			</tr>
			<tr>
				<td>직업</td>
				<td><select name="job">
					   <option value="가수">가수</option>
					   <option value="장군" selected="selected">장군</option>
					   <option value="공무원">공무원</option>
					 </select></td>
			</tr>
			<tr>
				<td><input type="submit" value="확인"></td>
				<td><input type="reset" value="입력취소"></td>
			</tr>
		</table>
	</form>
</body>
</html>

Person.java

package och02;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Person
 */
@WebServlet("/Person")
public class Person extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public Person() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		response.getWriter().append("Served at: ").append(request.getContextPath());
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		String name = request.getParameter("name");
		String id = request.getParameter("id");
		String password = request.getParameter("password");
		String gender = request.getParameter("gender");
		String[] notice = request.getParameterValues("notice");
		String job = request.getParameter("job");
		response.setContentType("text/html;charset=utf-8");
		PrintWriter out = response.getWriter();
		out.println("<html><body><h1>개인정보</h1>");
		out.println("이름 : " + name +"<p>아이디 : " + id + "<p>");
		out.println("암호 : " + password +"<p>성별 : " + gender +"<p>");
		out.println("수신메일 : ");
		if (notice != null) {
			for (int i = 0 ; i <notice.length;i++) {
				out.println(notice[i] + " ");
			}
		} else out.println("없음");
		out.println("<p>직업 : " + job);
		out.close();
	}

}

출력 결과

 

 

[JSP 문서의 구조]

 

[Servlet 수행 Process]

 

[JSP의 기초 문법]

[스크립팅 요소]

 

[JSP 문서의 구성 요소]

implicit object는 내장 객체이다.

 

[JSP 문서의 구성 요소]

 

[소스코드 저장 위치]

servlet : src/main/java (main>java)

jsp : html과 같은 위치인 webapp(main>webappp)

 

 

[och03]

cal.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
/* 나중과제   num1 / num2 입력및 문자Check */
	function chk() {
		if (!frm.num1.value) {
			alert("첫번째 수 ?");			
			frm.num1.focus();
			return false;
		}
		if (isNaN(frm.num1.value)) {
			alert("그게 숫자냐 ?");
			frm.num1.focus();
			frm.num1.value = "";
			return false;
		}
		if (!frm.num2.value) {
			alert("두번째 수 ?");
			frm.num2.focus();
			return false;
		}
		if (isNaN(frm.num2.value)) {
			alert("헐 천재 ?");
			frm.num2.focus();
			frm.num2.value = "";
			return false;
		}
		return true;
	}
</script>
</head>
<body>
	<h2>사칙연산할 데이터 입력</h2> 
	<form action="cal.jsp" name="frm" onsubmit="return chk()">
		첫번째 수 : <input type="text" name="num1">	<p>
		두번째 수 : <input type="text" name="num2">	<p>
		<input type="submit" value="확인">
	</form>
</body>
</html>

cal.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
  <!--   지시자 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
 <h1>사칙연산</h1>
 <% 
 	/* 스크립틀릿(scriptlet) */ 
 	/* 여기에 자바 코드를 작성한다. */
 	/* request는 내장객체라서 선언을 안해도 된다. cal.html에서 값을 request에 저장해서 가져온다. */
 	/* 서블릿과 똑같음. */
    int num1 = Integer.parseInt(request.getParameter("num1"));
	int num2 = Integer.parseInt(request.getParameter("num2"));
	int add = num1 + num2;
	int min = num1 - num2;
	int mul = num1 * num2;
	int div = num1 / num2;
 %>
<!--  Expression(표현식) -->
덧셈 :    <%=add %><p>
뺼셈 :    <%=min%><p>
곱셈 :    <%=mul %><p>
나눗셈 :   <%=div %><p>
</body>
</html>

 

출력 결과

 

color.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>좋아하는 색은 ?</h1>
<form action="color.jsp">
	빨강<input type="radio" name="color" value="red" checked="checked"><br>
	주황<input type="radio" name="color" value="orange"><br>
	노랑<input type="radio" name="color" value="yellow"><br>
	초록<input type="radio" name="color" value="green"><br>
	파랑<input type="radio" name="color" value="blue"><br>
	남색<input type="radio" name="color" value="navy"><br>
	보라<input type="radio" name="color" value="violet"><p>
	<input type="submit" value="확인"><br>
</form>
</body>
</html>

color.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<%
// Parameter 받기
String color = request.getParameter("color");
%>
<body bgcolor="<%=color%>">
<h1>익스프레션 이용한 색깔변경 </h1>

</body>
</html>

출력 결과

 

date.jsp

<%@page import="java.util.GregorianCalendar"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"  %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">

</script>
</head>
<body>
<%
	// 단독 수행 가능 
	GregorianCalendar gc = new GregorianCalendar();
    	//날짜 받을 때 %TF, 시간 받을 때 %TT 사용
    String date = String.format("%TF %TT", gc,gc);
%>
오늘은 <%=date %> 입니다


</body>
</html>

board.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	function chk() {
		if (!frm.title.value) {
			alert("제목 ?");
			frm.title.focus();
			return false;
		}
		if (!frm.writer.value) {
			alert("작성자 ?");
			frm.writer.focus();
			return false;
		}
		if (!frm.content.value) {
			alert("내용 ?");
			frm.content.focus();
			return false;
		}
		return true;
	}
</script>
</head>
<body>
	<h1>게시판 (Ctrl+Shift+F)</h1>
	<form action="board.jsp" name="frm" method="post" onsubmit="return chk()">
		<table bgcolor="pink">
			<tr>
				<td>제목</td>
				<td><input type="text" name="title"></td>
			</tr>
			<tr>
				<td>작성자</td>
				<td><input type="text" name="writer"></td>
			</tr>
			<tr>
				<td>내용</td>
				<td><textarea rows="6" cols="30" name="content"></textarea></td>
			</tr>
			<tr>
				<td><input type="submit" value="확인"></td>
				<td><input type="reset" value="입력취소"></td>
			</tr>
		</table>
	</form>
</body>
</html>

board.jsp

<%@page import="java.io.FileWriter"%>
<%@page import="java.util.Date"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
	request.setCharacterEncoding("utf-8");
	String title = request.getParameter("title");
	String writer = request.getParameter("writer");
	String content = request.getParameter("content");
	// Current Date
	Date date = new Date();
    
    //Tomcat Metadata 파일 저장
	//파일이름을 시간으로 지정.
     long fileName = date.getTime();
     //application은 내장객체이다. real은 파일이름
 	String real = application.getRealPath("/WEB-INF/out/"+fileName+".txt");
	System.out.println(real);	//잘 실행되는지 확인하기 위해 로그 걸어놓기
	// FileWriter : File 저장하는 객체 
    FileWriter fw = new FileWriter(real);
	// File 내용
	String msg = "제목 : " + title + "\r\n";
	msg += "작성자 : " + writer + "\r\n";
	msg += "내용 : " + content + "\r\n";
    fw.write(msg);	//정보 저장
	fw.close();
	
	//화면출력 방법1
    out.println("제목1  : " + title +"<p>");
	out.println("작성자1 : " + writer +"<p>");
	out.println("작성일1 : " + date +"<p>");
	out.println("내용1  : " + content +"<p>");
%>
<!--  화면출력 방법2 -->
제목2  : <%=title %> <p>
작성자2 : <%=writer %> <p>
작성일2 : <%=date %> <p>
내용2  : <%=content %> <p>

</body>
</html>

 

입력 값

출력 결과

 

 

C:\Jsp\jspSrc\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\och03\WEB-INF\out

위치에 저장된 파일 확인

 

반응형