JSP & Servlet

2. 0810_JSP문법, script tag, directive tag, action tag, 내장 객체

55yudi 2021. 8. 10. 22:32

1. 웹 프로그래밍 기술

  • 클라이언트 기술
    - 화면 UI : HTML, CSS
    - 화면에서 수행할 기능 : 자바스크립트
       * 사용자가 화면에서 버튼을 누른다.
       * jQuery & Ajax    (버튼눌렀을 때 행위, (이벤트 핸들러))
    - 서버 기술
       * 동적 페이지 기술 : JSP
       * 프로그래밍 언어 : 자바

2. 웹의 매커니즘

  • 클라이언트가 서버에 요청을 보내는 경우 : A태그를 클릭하면
  • 서버에서 요청을 받으면 무엇을 하는지 : Html을 요청했다면 그걸 응답하고, 없으면 404로 응답한다.
  • Jsp를 요청했다면 (동적 페이지) : 내부적으로 java파일로 변환되고 변환된 자바파일에서의 메서드가 실행된다.

스크립트 태그

1. Classpath안에 tomcat이 없을 경우

  • myweb 프로젝트 마우스 오른쪽 클릭 -> Properties -> Java Build Path -> Libraries -> Classpath -> Add Library -> Server Runtime -> tomcat 클릭후 Apply and Close

 

 2. 스크립트 : 컴파일없이 소스코드가 실행되는 느낌

  • 자바스크립트, VB스크립트 등    + jsp_tag_test.jsp

 

 3. JSP문법과 스크립트 태그

  • <%! ... %> : 선언문 태그 - 선언문, 변수/메서드 정의, 선언 (<-- 객체변수를 사용한다.)
  • <% ...  %> : 스크립틀릿 태그 - 자바 문법을 작성
  • <%= ... %> : 표현문 태그 - 변수, 계산식, 메소드 호출 결과를 문자열 형태로 출력하는데 사용
                                      - 표현식, 변수 참조, 함수 결과 참조에 사용

 

4. 변수의 종류

종류 선언위치 생성(메모리 할당) 시기
클래스 변수 클래스 영역 클래스가 메모리에 올라갈 때
인스턴스 변수(객체 변수) 인스턴스가 생성될 때
지역 변수(로컬 변수) 클래스 이외의 영역 (생성자, 메서드 등) 변수 선언문이 수행될 때
  • 클래스 변수 : 인스턴스 변수에 static만 붙여서 만듦, 클래스 내에서 선언
  • 로컬 변수(전역 변수) : 해당 함수 안에서만 활용되는 것, 메서드 안에서 선언되고 해당 메서드 안에서만 사용 가능

 

 

5. 주석 comment 처리

프로그래밍언어 표현방법 .jsp 파일에서 사용시
JSP <%-- --%> 응답 포함 X, 결과에 포함X
HTML <!-- --> 응답 포함 O

 

디렉티브 태그 (Ch3.)        + taglib-directive-test.jsp
  • 1. page 디렉티브 태그   <%@ page ... %>
    • 현재 JSP 페이지에 대한 정보를 설정하는 태그
    • 일반적으로 JSP 페이지의 최상단에 선언하는 것을 권장
    • 속성 종류
종류 설명
language 속성 기본 값은 java로 되어 있으며, 다른 언어 또한 가능   예) EUC-KR, UTF-8
<%@ language="java" %>
contentType 속성 jsp 페이지의 콘텐츠 유형(MIME-Type)을 설정하는데 사용
<%@ page contentType="text/html; charset=UTF-8" %> 
import 속성 현재 jsp 페이지에서 사용할 자바 클래스 설정하는데 사용
<%@ page import = "java.io.*, java.lang.*" %>
session 속성 페이지의 http 세션 사용/종료

 

  • 2. include 디렉티브 태그   <%@include ...%>
    • 현재 jsp 페이지 특정 영역에 다른 문서를[외부 파일의 내용을] 포함하는 태그
    • 현재 JSP 페이지에서 포함할 수 있는 외부 파일 (HTML, JSP, 텍스트 파일)
    • 예) <%@ include file = "header.jsp"%> 
      • header.jsp 파일의 내용을 이 JSP 페이지에 포함한다는 것을 의미

 

  • 3. taglib 디렉티브 태그   <%@taglib ...%>
    • taglib 디렉티브 태그를 사용하기 위해 jstl-1.2jar 설치 http://www.java2s.com/Code/Jar/j/Downloadjstl12jar.htm
    • 이클립스 현재 프로젝트 -> WebContent 폴더 -> WEB-INF 폴더 -> lib 폴더에 다운받은 jstl-1.2.jar 파일을 붙여넣어줌
    • JSP 지시자 태그를 이용 :  <%@ taglib uri="URI 주소" prefix ="접두사"%>
      • uri : 태그 라이브러리의 네임 스페이스 URI 식별자
      • prefix : JSTL 태그를 사용할 때 태그 이름 앞에 붙일 접두사
    • 지시자 : page, include, taglib
    • for(EmpVo vo : list) {}
      - vo : for루프를 돌면서 생기는 변수
      <c:forEach var="vo" items="${list}">
      - vo : for문 안의 vo와 같은 것
      - list : for문 안의 list와 같은 것

    •  JSP 라는 게 동적페이지 이다.
        * 여러 JSP가 있을 때
         - Main.jsp
            - List.jsp
            - Detail.jsp
            - Login.jsp 등

    • 태그 라이브러리 표준 선언문
      태그 라이브러리 선언문
      Core <%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c" %>
      Database <%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql" %>
      XML <%@ taglib uri="http://java.sun.com/jsp/jstl/xml" prefix="x" %>
      Functions <%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
      I18N <%@ uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
    • <c:out> 태그 : 출력문 만드는 태그
      • <c:out value = "출력값"></c:out>
    • <c:forEach>태그 : 반복작업에 사용하는 태그 (예 : 배열 요소를 순서대로 반복해 처리할 수 있음)
      • <c:forEach var = "변수명" items = "목록 데이터" begin = "시작 인덱스" end = "종료 인덱스"></c:forEach>
        • var : items에서 항목의 값을 가리는 참조 변수
        • items : 배열, java.util.Collenction 구현체(ArrayList, LinkedList ... ) 가 올 수 있음
      • .jsp 위쪽 코드에 추가 
        <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>​
      • 예제문제 1
        • <% pageContext.setAttribute("arrList", new String[]{"가", "나", "다", "라", "마"}); %>
          <ul>
              <c:forEach var="val" items="${arrList}">
                  <li>${val}</li>
              </c:forEach>
          </ul>
      • JSP 기본 객체의 속성 Attribute
        • pageContext, request, session, application
        • 속성 처리 메소드
          • 메소드 리턴타입 설명
            setAttribute(String name, Object value) void name인 속성의 값을 value로 지정
            getAttribute(String name) Object name인 속성의 값을 구함. 존재하지않을 경우 null 리턴
            removeAttribute(String name) void name인 속성 삭제
            getAttributeNames() java.util Enumeration 속성의 이름 목록 구함
      •  예제문제 2 -  ArrayList
        • <%
              List<String> list = new ArrayList<>();
              list.add("a");
              list.add("b");
              list.add("c");
              pageContext.setAttribute("list", list);
          %>
          
          <ul>
              <c:forEach var="value" items="${list}">
                  <li>${value}</li>
              </c:forEach>
          </ul>
      • 예제문제 3 
        • <% pageContext.setAttribute("arrList2", new String[]{"가", "나", "다", "라", "마"}); %>
          <ul>
          	<c:forEach var="value" items="${arrList2}" begin="1" end="3">
          		<li>${value}</li>
          	</c:forEach>
          </ul>

 

액션 태그
  • <jsp:forward> 액션태그
    • JSP 페이지에서 다른 JSP페이지로 요청 처리를 전달할 때 사용
      <jsp:forward page="이동할 페이지"> : 특정 페이지로 이동
      • taglib-directive-test.jsp에서 taglib-directive-test2.jsp 파일을 이용한다고 하면, 아래와 같이 사용
      • <jsp:forward page="taglib-directive-test2.jsp"></jsp:forward>
      • 1. 웹 브라우저의 요청이 taglib-directive-test.jsp에 전달
      • 2. taglib-directive-test.jsp <jsp:forward> 액션태그 실행
      • 3. 요청 흐름에 따라 taglib-directive-test.jsp에서 사용한 request 기본객체와 response 기본객체가 taglib-directive-test2.jsp로 전달
      • 4. taglib-directive-test2.jsp는 응답 결과 생성
      • 5. taglib-directive-test2.jsp가 생성한 결과가 웹브라우저에 전달
      • 중요 : taglib-directive-test.jsp 가 아닌 taglib-directive-test2.jsp 가 생성한 응답 결과가 웹브라우저에 전달

 

  • 브라우저의 주소입력창에
    http://localhost:9000/myweb/login-form.html을 입력하고 엔터를 치면 화면이 나타남
  • 브라우저에서 버튼을 누르면 브라우저는 서버에게 jsp를 요청할 것이다.
       - 뭘 보고 알 수 있나?
          : html의 form태그에 액션 attribute로 value가 있다.(액션에 jsp해줘서)

  •  지시자
    • page
    • include
    • taglib

 

내장 객체
  • 내장 객체 : jsp 컨테이너에 미리 정의된 객체(변수와 함수를 포함)
  • 객체 : 변수와 함수(메서드)로 이루어진 것 
           c.f. 멤버 변수, 메소드 매개변수

  • 내장 객체의 종류
    • request : JSP 페이지에서 가장 많이 사용되는 기본 내장 객체
      • 요청파라미터

 

실습 코드

1. jsp-tag-test.jsp

<%@page import="com.sun.net.httpserver.Authenticator.Result"%>
<%@ 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>jsp tag 연습</h1>
	<%-- jsp주석이다. 결과에 포함되지 않는다. 응답에 포함되지 않는다.  --%>
	<!-- html 주석이다. 응답에 포함된다.  -->
	
	<% // 스크립틀릿 
		Integer count = 500;
		System.out.println(count); 	// 콘솔 창 출력 
		out.println("count = " + count); // 웹에 출력 
	%>
	name : <%= name %>
	<%!
		String name="haha";	// String 형 타입의 객체 변
	
		// 함수를 정의한 것 
		void print() {
		}
	%>
</body>
</html>

 

2. jsp-tag-test2.jsp

<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.Statement"%>
<%@page import="java.sql.Connection"%>
<%@ 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>
	<!-- 현재 프로젝트 안에 WEB-INF 폴더안에 lib 폴더에 ojdbc8.jar 를 붙여넣어줘야함  -->
	<%
		Class.forName("oracle.jdbc.driver.OracleDriver");
		Connection con = DriverManager.getConnection("jdbc:oracle:thin:@localhost:49161:xe","hr","hr");	
		System.out.println(con.getClass().getName());
		String sql = "select * from employees";
		Statement stmt = con.createStatement();
		ResultSet rs = stmt.executeQuery(sql);
		while(rs.next()){
			out.println(rs.getString(1));	
	%>
	
	<%=rs.getString(1) %> <br>
	<% 
		}
	%>
</body>
</html>

 

3. jsp-tag-test3.jsp

<%@page import="java.util.List"%>
<%@page import="myweb.EmpVO"%>
<%@page import="java.util.ArrayList"%>
<%@page import="myweb.EmpDAO"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.Statement"%>
<%@page import="java.sql.Connection"%>
<%@ 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>
	<!-- 현재 프로젝트 안에 WEB-INF 폴더안에 lib 폴더에 ojdbc8.jar 를 붙여넣어줘야함  -->
	<%
		EmpDAO dao = new EmpDAO();
		List<EmpVO> list = dao.getList();
		for(EmpVO vo : list) {
			out.println(vo.empId + "<br>");
		}
	%>
	
	<%-- <%=rs.getString(1) --%> <br>
	<% 
		//}
	%>
</body>
</html>

 

4-1. loginform.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<form action="Login-action.jsp">
		id : <input type="text" name = "userId"> <br>
		pw : <input type="password" name = "password"> <br>
		<input type="submit" value = "로그인하기">
		
	</form>
</body>
</html>

 

4-2. Login-action.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>
	클라이언트에서 사용자가 로그인하기 버튼을 누르면 jsp가 요청된다.
	클라이언트가 전송한 데이터(아이디와 패스워드)를 추출해야 한다. -> request 내장객체를 이용한다.
	로그인절차수행 
	<%
		String id = request.getParameter("userId");
		String pw = request.getParameter("password");
	%>
	id = <%=id %>, pw=<%=pw %>이군요! <br>
	id = <%=request.getParameter("userId") %>, pw=<%=request.getParameter("password") %> %>
</body>
</html>

 

5-1. include-directive-test.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>
	<%@ include file = "myheader.jsp" %>
	This is Include-directive Test!
	<%@ include file = "myfooter.jsp" %>
</body>
</html>

 

5-2. myfooter.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>This is Footer</h1>
</body>
</html>

5-3. myheader.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>This is Header</h1>
</body>
</html>

 

6-1. taglib-directive-test.jsp

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

<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert titlehere</title>
</head>
<body>
	<%
		EmpDAO dao = new EmpDAO();
		List<EmpVO> list = dao.getList();
		request.setAttribute("list", list);
	%>
	<jsp:forward page="taglib-directive-test2.jsp"></jsp:forward>	<!-- 액션태그  -->
	
	
</body>
</html>​

 

 

6-2. taglib-directive-test2.jsp

<%@page import="myweb.EmpVO"%>
<%@page import="java.util.List"%>
<%@page import="myweb.EmpDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert titlehere</title>
</head>
<body>
	<!-- 내장객체 request에서 list라는 이름으로 저장된 목록을 가져온 -->
	<c:forEach var="vo" items="${list}"> 
		id:${vo.empId}, lastName:${vo.lastName} <br/>	<!--  getEmpId라는 메서드 실행 -->
	</c:forEach>
	<p>=============================</p>
	<%
		List<EmpVO> list = (List<EmpVO>)request.getAttribute("list");
		for(EmpVO vo : list) {
			out.println("id:" + vo.empId + "<br>");
		}
	%>
	
</body>
</html>

 

6-3 EmpDAO.java

package myweb;


import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.List;

public class EmpDAO {
	// getList라는 메서드를 정의 할 수 있는가 ?
	// 리턴타입과 매개변수 (x)
	public List<EmpVO> getList() throws Exception {
		ArrayList<EmpVO> list = new ArrayList();
		
		Class.forName("oracle.jdbc.driver.OracleDriver");
		Connection con = DriverManager.getConnection("jdbc:oracle:thin:@localhost:49161:xe","hr","hr");	
		System.out.println(con.getClass().getName());
		String sql = "select * from employees";
		Statement stmt = con.createStatement();
		ResultSet rs = stmt.executeQuery(sql);
		
		while(rs.next()) {
			//EmpVO 객체를 만들고 객체 변수에 데이터베이스의 데이터로 설정하고
			EmpVO vo = new EmpVO();
			vo.empId = rs.getInt(1);
			vo.lastName = rs.getString("last_name");
			// 리스트에 넣어둔다.
			list.add(vo);
		}
		return list;
		
	}

}

 

6-4 EmpVO.java

package myweb;

public class EmpVO {
	public int empId;
	public String lastName;
	
	public int getEmpId() {
		return empId;
	}
	public void setEmpId(int empId) {
		this.empId = empId;
	}
	public String getLastName() {
		return lastName;
	}
	public void setLastName(String lastName) {
		this.lastName = lastName;
	}
	
}