JSP (Java Server Page)
1. JSP는 동적인 웹 페이지를 제공하는 서버에서 실행되는 스크립트 언어. 확장자는 .jsp
2. 기본문법은 Java를 따르지만 표기법은 JSP를 따른다.
//JSPSample01.jsp -> 서버에서 실행되는 JSP 페이지는 결과가 HTML Document가 된다.
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%
String str = "Hello, JSP World!";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<div>
<h3><%=str%></h3>
</div>
</body>
</html>
//클라이언트에게 전달된 HTML Document 의 모습
//->JSP 영역의 소스코드는 서버에서 실행되었기 때문에 클라이언트에 전달되는 것은 결과값만 전달된다.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<div>
<h3>Hello, JSP World!</h3> //->결과값
</div>
</body>
</html>
//최종 실행된 웹페이지 모습
Hello, JSP World!
JSP 구성 요소
1. 디렉티브(Directive) : 페이지에 대한 설정 정보 지정. 클래스의 속성을 변경.
<%@ ... %>
2. 선언부(Declaration) : 스크립트릿이나 표현식에 사용할 사용자 정의 메소드 작성시 사용.
<%! ... %>
3. 표현식(Expression) : HTML 문서에 결과 값을 출력할 때 사용.
<%= ... %>
4. 스크립트릿(Scriptlet) : JSP에서 자바 코드를 기술할 때 사용. 미리 준비된 메소드의 내부 코드가 된다.
<% ... %>
서식 지정 출력 예
//JSPSample02.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@ page import="java.lang.*" %>
<%
// 서식 지정 출력 예
String str = String.format("%d + %d = %d <br>", 10, 20, (10+20));
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<div>
<h3><%= str %></h3>
</div>
</body>
</html>
자료형
1. JSP에서의 자료형은 Java와 동일
기본자료형 - 숫자형(정수(byte, short, int, long), 실수(double, float)), 불린(boolean)형, 문자(char)형
참조형 - 클래스, 배열, 문자열(String)형
변수
1. JSP에서의 변수는 Java와 동일
2. 스크립트릿에서 선언된 변수는 지역변수. 선언부에서 선언된 변수는 멤버변수.
스크립트릿에서 선언된 변수는 JSP 페이지 내부 전체에서 사용가능.
연산자
1. JSP에서의 연산자는 Java와 동일.
2. 산술, 관계, 논리, 대입 연산자.
제어문(if, while, for, switch, break, continue, 확장 for)
1. JSP에서의 제어문은 Java와 동일.
반복문을 이용해서 1~100사이의 짝수만 출력. JSP 이용.
//JSPSample03.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%
String str = "";
int sum = 0;
for (int a=1; a<=100; a++) {
if (a%2 == 0) {
str += a + "<br>";
sum += a;
}
}
str += sum;
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<div>
<h3><%=str%></h3>
</div>
</body>
</html>
문제) 반복문을 이용해서 1~100 사이의 짝수만 출력.
마지막에 짝수들의 합까지 출력. JSP 이용.
실행 예)
2
4
6
8
...
100
------
합계:2550
//JSPSample04.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%
StringBuilder str = new StringBuilder();
int sum = 0;
for (int a=1; a<=100; a++) {
if (a%2 == 0) {
str.append(String.format("%d<br>", a));
sum += a;
}
}
str.append(String.format("----------<br>합계: %d", sum));
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<div>
<h3><%=str%></h3>
</div>
</body>
</html>
데이터 송수신 테스트1 (텍스트 박스 객체)
//send01.jsp -> 입력 페이지 역할. 입력된 데이터를 서버로 전송.
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<div>
<h2>데이터 송수신 테스트1</h2>
<!-- <form> 에서 action 속성과 method 속성 필수 -->
<form action="Receive01.jsp" method="post">
<!-- JSP에서는 식별자를 name 속성으로 구분 -->
이름 <input type="text" name="name">
전화 <input type="text" name="tel">
<!-- submit 버튼을 클릭하면 데이터 전송됨 -->
<input type="submit" value="회원가입">
</form>
</div>
</body>
</html>
//receive01.jsp -> 처리, 출력 페이지 역할. 클라이언트가 전송한 데이터 수신 및 처리. 결과 메세지를 클라이언트에게 전송.
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%
//request JSP 전용 내장 객체(HttpServletRequest 클래스)
//getParameter() 메소드는 데이터 수신 담당. 자료형은 전부 String 변수로 받아야함.
//송수신 데이터에서 한글이 포함된 경우는 인코딩 추가 필요.
request.setCharacterEncoding("euc-kr");
String name = request.getParameter("name");
String tel = request.getParameter("tel");
//결과 메시지 출력
StringBuilder str = new StringBuilder();
str.append(String.format("name: %s, tel: %s<br>", name, tel));
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<div>
<h2>데이터 송수신 테스트1</h2>
<h3><%=str%></h3>
</div>
</body>
</html>
데이터 송수신 테스트2 (라디오 객체)
//Send02.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
<script type="text/javascript">
function myFunc(obj) {
//데이터 검사
var radios = document.getElementsByName("size");
var check = 0;
for (var a=0; a<radios.length; a++) {
if (radios[a].checked) {
check = radios[a].value;
}
}
//데이터 전송
var msg = document.getElementById("msg");
msg.style.display = "none";
if (check == 0) {
msg.style.display = "inline";
} else {
obj.form.submit();
}
}
</script>
</head>
<body>
<div>
<h2>데이터 송수신 테스트2</h2>
<form action="Receive02.jsp" method="post">
-사이즈 선택- <br>
<input type="radio" name="size" value="1"> 싱글레귤러(1)<br>
<input type="radio" name="size" value="3"> 파인트(3)<br>
<input type="radio" name="size" value="5"> 쿼터(5)<br>
<input type="button" value="확인" onclick="myFunc(this)"><br>
<span id="msg" style="color:red; display:none;"> 사이즈를 선택해야 합니다.</span>
</form>
</div>
</body>
</html>
//Receive02.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%
//서버에 수신되는 라디오 객체의 값은 선택된 항목만 수신된다. 즉, 라디오는 최대 한개 수신
//라디오 객체의 value 속성의 값이 수신된다.
String size = request.getParameter("size");
String str = "";
//switch(변수) {} 에서 변수값은 int형 자료만 허용함
switch (Integer.parseInt(size)) {
case 1: str = "싱글레귤러(1)"; break;
case 3: str = "파인트(3)"; break;
case 5: str = "쿼터(5)"; break;
}
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<div>
<h2>데이터 송수신 테스트2</h2>
<h3>출력 -----------------</h3>
<div>선택한 사이즈는 <%=str%>입니다.</div>
</div>
</body>
</html>
데이터 송수신 테스트3 (체크박스 객체)
//Sand03.jsp
//Receive03.jsp
문제) 이름, 국어, 영어, 수학 점수를 입력 받아서 총점, 평균 계산해서 결과 출력하는 페이지 작성. JSP 이용.
//Send04.jsp
//-> 이름, 국어, 영어, 수학 점수를 입력받는 페이지 작성. 서버에 데이터 전송.
//-> 데이터 검사 과정 추가. 자바스크립트 이용.
//Receive04.jsp
//-> 이름, 국어, 영어, 수학 점수를 수신해서 총점, 평균 계산 및 결과 메시지 출력.
//-> 테이블 태그 이용해서 표 형태로 출력.
문제) 거스름돈을 환폐단위로 구분해서 출력. JSP 이용
실행 예)
금액(10~1000) [ 990 ] [결과]
총액 : 990원
오백원 1개, 백원 4개, 오십원 1개, 십원 4개
//Send&Receive05.jsp
문제) 세 개의 숫자를 전달받아 가장 큰 숫자, 가장 작은 숫자 구하기. JSP 이용.
실행 예)
숫자1 [XX ] 숫자2 [YY ] 숫자3 [ZZ ] [결과]
입력 받은 숫자 : XX, YY, ZZ
가장 큰 숫자 : ZZ
가장 작은 숫자 : XX
//Send_Receive05.jsp
'Java > JSP & Servlet' 카테고리의 다른 글
| [20121120] 6일차 (직원관리) (0) | 2012.12.04 |
|---|---|
| [20121119] 5일차 (직원관리) (0) | 2012.12.04 |
| [20121116] 4일차 (회원관리 + 성적처리) (0) | 2012.12.04 |
| [20121115] 3일차 (JSP와 JDBC 연동, DTO클래스와 DAO클래스 연동 코딩) (0) | 2012.11.15 |
| [20121114] 2일차 (POST 전송방식, GET 전송방식, forward(), sendRedirect()) (0) | 2012.11.15 |
WRITTEN BY
