Notice
Recent Posts
Recent Comments
Link
«   2025/06   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30
Tags more
Archives
Today
Total
관리 메뉴

parisangsoo

JSP 03/14 본문

JSP

JSP 03/14

SangssI 2023. 3. 14. 16:27

JSP 파일의 기본 문법

<%@ 내용 %> :  jsp의 헤더 - 페이지 인코딩, import등의 설정을 위해 반드시 필요, 자바 라이브러리 import 등등

Ex)   <%@ page language="java" contentType="text/html; charset=UTF-8"
                  pageEncoding="UTF-8"%>

 

<%  자바코드; %> :  스크립트릿 영역  - jsp에서 자바코드를 사용하고자 할 때 지정하는 영역 , 자바와 동일하게 ; 필수

                                  자바 코드 외에 어떠한 다른 언어도 사용불가능.

Ex) 
<% //jsp --> Servlet --> web
//jsp는 서블릿을 거쳐 화면으로 반환되기 때문에, servlet이 가지고있는 

요청 : request 객체 

응답 : response 객체를 사용할 수 있다.
String ip = request.getRemoteAddr();
String msg = "안녕하세요"; %>

<%= 변수명 %> : 스크립트 릿에 정의된 변수를 출력하는 영역(변수명; 과 같이;은 사용할 수 없다)

Ex)    <%= msg  %>
         <h1><%= ip %><!-- 스크릿트릿의 출력 영역 --></h1>

1. test.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- jsp : java server page
	 html만으로는 불가능한 연산이나 라이브러리등을 사용할 수 있는 언어
	 서블릿 만으로는 한계가 있는 디자인적인 부분을 쉽게 할 수 있도록 도와주는 언어 -->    

<%
	//스크립트릿(scriptlet) : jsp에서 자바코드를 사용하고자 할 때 지정하는 영역
	//jsp --> Servlet --> web
	//jsp는 서블릿을 거쳐 화면으로 반환되기 때문에, servlet이 가지고있는 요청, 응답 처리 객체를 사용할 수 있다.
	String ip = request.getRemoteAddr();
	
	
	String msg = "안녕하세요";
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<p>&lt;%@ 내용 %&gt; : jsp헤더 - 페이지 인코딩, import등의 설정을 위해 반드시 필요</p>
	<p>&lt;% 자바코드; %gt; : 스크립트릿  - jsp에서 자바코드를 사용하고자 할 때 지정하는 영역</p>
	<p>&lt;%= 변수명 %&gt; : 스크립트 릿에 정의된 변수를 출력하는 영역(변수명; 과 같이;은 사용할 수 없다)</p>
		
	
	<%= msg  %>

	<h1><%= ip %><!-- 스크릿트릿의 출력 영역 --></h1>
</body>
</html>

<%! %> 과 <% %> 의 차이

웹에서의 전역변수와 지역변수의 차이는 두 영역에서 변수의 값을 ++ 연산자를 활용해 새로고침을 누르게 되면

전역변수는 웹홈페이지보다 위의 전역변수로 증감이 되지만 지역변수는 새로고침에 의해 계속 0으로 초기화되어 나타남

<%@page import="java.util.Random"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<%!//선언부 : 변수나 메서드를 정의하는 영역(전역변수 개념)
	int n = 0;
	Random rnd = new Random();

	public int plus(int a, int b) {
		return a + b;
	}%>

<%
	//스크립트 릿 : 지역변수의 개념
	int n1 = 0;
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<p><%= plus(10,6) %></p>
	<p><%="n :" + n++ %></p>
	<p><%="n1 : " + n1++ %>
</body>
</html>

 

JSP에서의 배열을 이용한 HTML과 스크립트 릿을 동시에 사용하여 효율적인 화면 디자인 하기

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<%
	String fruit[] = {"사과","배","오렌지","참외","복숭아"};
%> 
    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<ul>
		<% for(int i=0; i<fruit.length; i++) { %>    <!-- 스크립트릿 자바 코드 -->
			<li><%= fruit[i] %></li> <!-- html코드안에 스크립트릿 자바 결과코드 -->
			
			
		<%} %> <!-- 자바코드 -->
	</ul>
</body>
</html>

VO (Value Object) : 여러가지 정보들을 묶어서 하나의 클래스로 관리하기 위한 개념

1. 일반적인 자바 클래스 생성

Ex) PersonVO.java

package vo;

public class PersonVO {

	//VO(Value Object) : 여러가지 정보들을 묶어서 하나의 클래스로 관리하기 위한 개념
	
	private String name;
	private int age;
	private String tel;
	
	
	
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public int getAge() {
		return age;
	}
	public void setAge(int age) {
		this.age = age;
	}
	public String getTel() {
		return tel;
	}
	public void setTel(String tel) {
		this.tel = tel;
	}
	
}

2. JSP 파일 생성

test_Person.jsp

<%@page import="java.util.List"%>
<%@page import="java.util.ArrayList"%>
<%@page import="vo.PersonVO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<!-- Model 1 구조 : 하나의 jsp파일에서 자바의 연산코드와 html의 디자인 코드를 모두 작성하는 형태 --> 

    <%
    	PersonVO p1 = new PersonVO();
      	p1.setName("홍길1");
      	p1.setAge(20);
      	p1.setTel("010-111-1111");
      	
      	PersonVO p2 = new PersonVO();
      	p2.setName("홍길2");
      	p2.setAge(23);
      	p2.setTel("010-222-2222");
      	
      	PersonVO p3 = new PersonVO();
      	p3.setName("홍길3");
      	p3.setAge(3);
      	p3.setTel("010-333-3333");
      	
      	//준비해둔 vo객체들을 ArrayList에 탑재
      	List<PersonVO> pList = new ArrayList<>(); // HashMap <String, Integer> map = new HashMap<>();
      	                                          // Map <String, Integer> map = new HashMap<>(); 부모의 클래스(인터페이스)로 만들면 메모리가 더욱 효과적
      	pList.add(p1);
      	pList.add(p2);
      	pList.add(p3);
      	
      	
    %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<style>
		table {border-collapse: collapse;}
	</style>

</head>
<body>
	<table border = '1' align='center'>
	<caption>::: 개인정보 목록 :::</caption>
	<colgroup>
		<col span = '2' width = 100px>
		<col width = 200px>

	</colgroup>
		<tr align='center'>
			<th>이름</th>
			<th>나이</th>
			<th>전화번호</th>
		</tr>
		<% for(int i=0; i<pList.size(); i++) { %>
		<tr align='center'>
			<td><%= pList.get(i).getName() %> </td>
			<td><%= pList.get(i).getAge() %> </td>
			<td><%= pList.get(i).getTel() %> </td>
		</tr>
		<%} %>

	</table>
</body>
</html>

JSP 파일에서 Servlet에 파라미터 전달이 아닌 JSP에서 JSP로의 파라미터 전달방법

f.action 코드에서 mapping이 지정된 .do Servlet 파일이 아닌 t_param.jsp로 파라미터 전달 및  t_param.jsp 호출

 

f.method 에서 속성을 지정하지 않으면 기본값 get 방식으로 파라미터가 전달 된다. 하지만 get 방식은 url에 파라미터 값이 보이게 전달이 되는데 중요한 내용을 보안적으로 유리하게 하기 위해선 f.method="post" 를 이용하여 post방식으로 전달 할수 있다. 그렇게 되면 파라미터를 받는 jsp파일은 스크립트릿 공간 상단에

request.setCharacterEncoding("utf-8");코드를 추가해줘야 한다. 

*get 방식은 추가하지 않아도 됨*

 

1. jsp_param.input.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>
	<script>
	function send( f ) {
		let name = f.name.value;
		let age = f.age.value;
		let tel = f.tel.value;
		
		//유효성 체크
		if( name == '') {
			alert("이름을 입력하세요");
			f.name.focus(); // name속성의 input에게 커서를 옮긴다
			return;
		}
		
		if(age == '') {
			alert("나이를 입력하세요");
			f.age.focus();
			return;
		}
		
		f.action = "t_param.jsp";
		//t_param.jsp?name=hong&age=30&tel=010-111-1111
		f.method = "post";
		f.submit();
		
	}
	
	
	</script>



</head>
<body>
	<form>
		이름 : <input name="name"> <br>
		나이 : <input name="age"> <br>
		전화 : <input name="tel"> <br>
		<input type = "button" value="파라미터 전송" onclick="send(this.form);"> 	
	</form>
</body>
</html>

2. t_param.jsp    :  전달되는 파라미터를 받는 jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
    
    <!-- post방식으로 파라미터가 전달 되었을때, 값에 한글이 섞여있다면 깨져서 표기된다 -->
    <!-- 이를해결하기위해 request를 통해 메서드를 정의 해줘야 한다-->
 <%
 	request.setCharacterEncoding("utf-8");
 	
		//t_param.jsp?name=hong&age=30&tel=010-111-1111 파라미터가 넘어온 상태
 	String name = request.getParameter("name");
 	int age = Integer.parseInt(request.getParameter("age"));
 	String tel = request.getParameter("tel");
 %>   
    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<style>
		table {border-collapse: collapse;}
	</style>
</head>
<body>
	<table border = '1'>
	<caption> 받아온 정보</caption>
	<tr>
		<th>이름</th>
		<td><%=name%></td>
	</tr>
		<tr>
		<th>나이</th>
		<td><%=age%></td>
	</tr>
		<tr>
		<th>전화번호</th>
		<td><%=tel%></td>
	</tr>
	
	
	</table>
</body>
</html>
저작자표시 (새창열림)

'JSP' 카테고리의 다른 글

Ajax,EL,Json 03/20  (0) 2023.03.21
03/17 JSP (베이커리 홈페이지)  (0) 2023.03.19
03/16 (친구관리 홈페이지)  (0) 2023.03.19
JSP 03/16 (성적관리 홈페이지)  (0) 2023.03.19
DB와 JSP 연동 03/15  (0) 2023.03.15
'JSP' Related Articles more
Comments