| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 | 31 |
- 자바의정석
- VUE
- 코딩테스트
- 자스코테
- 리액트
- 정보처리기사실기
- 리액트네이티브
- 정보처리기사
- 정보처리기사요약
- 자바스크립트
- 스프링
- 이안의평일코딩
- 평일코딩
- 정보처리기사정리
- 타입스크립트
- php
- ReactNative
- spring
- 국비코딩
- CSS
- 오라클
- react
- 자바스크립트 코딩테스트
- Java의정석
- 국비IT
- 정보처리기사실기정리
- javascript
- typescript
- Oracle
- 정보처리기사실기요약
- Today
- Total
이안의 평일코딩
JSP 2일차 - 내장객체(기본객체), error처리 본문
2020.09.21(월)
default => EUC-KR
반드시 변경(UTF-8) : java, css, jsp, html, xml => github시 한글이 정상적으로 된다
contentType ==> 톰캣이 실행하고 => 결과값 ?
========== text/html, text/xml
======== ========
화면을출력 문서만저장
import : 기존에 있는 클래스를 읽어 올 때
errorPage : 에러가 났을 경우에 지정된 파일로 이동
프로그램을 만들 때 : 서버에서 보내는 파일 출력
404 : 사용자가 파일명을 보내줄 때 => 서버에 파일이 존재하지 않을 때
프로그래머가 실수로 링크시에 파일명을 틀리게 만든 경우가 많다
500 : 톰캣이 jsp파일을 자바로 변경후에 컴파일 에러
소스코딩의 문제 발생
400 : 데이터 전송시에 잘못된 데이터가 전송된 경우
예) IE에서는 URL뒤에 한글을 보내면 400(셋팅하기 전에는 크롬을 이용)
ArrayList, 클래스 주소를 전송
415 : UTF-8, EUC-KR 한글 변환 코드가 틀릴 경우
예) UFT-8 ECU-KR
200 : 정상 수행을 했을 경우 => 브라우저로 서버에서 200을 보내주면
화면에 바로 출력
배포를 할 때 : 에러파일을 만들어서 처리
실행 순서 http://localhost/OnLineStudy8/jsp/basic1.jsp
====================== 파일명을 보내준다
클라이언트가 브라우저 요청 ========================
톰캣이 ==> 어떤 브라우저에서 요청했는지 여부 확인
*** 파일을 요청하기전에 클라이언트 정보를 먼저 전송
=============
1) IP
2) GET/POST
3) XML,HTML
============= header정보
톰캣이 받아서 파일을 찾은 후 ==>
basic1.jsp ===> basic1_jsp.java파일 생성 ==> 컴파일
===> basic1_jsp.class생성 ==> 가상머신(JVM)
===> 한줄씩 읽어서 번역 ====> 메모리에 <html>만 출력한다
======================
클라이언트 브라우저가 읽어서 출력 화면 생성
클라이언트가 파일을 요청시에 어떤 화면을 보여줄건지를 만드는 사람 : 웹프로그래머 (99page)
JSP => out.println("<html>")
==========
생략
=> 녹색으로 출력되는 부분에 out.println()
=> 녹색부분이 => 클라이언트 브라우저에서 읽어가는 부분
JSP => Java+HTML
===========
구분 ==> 스크립트릿
======== 자바만 사용이 가능
<%
메소드안의 사용하는 일반 자바
변수선언
메소드 호출
제어문, 연산자 사용
%>
<%= 출력내용만 설정 %>
out.println("데이터");
=>HTML, JAVA, CSS
=============== html부분, java를 나눠서 처리(MV) => 연결(C) ====> MVC
=> JSP를 사용하게 되면 (JSP에서 지원하는 객체) => 미리 만들어져 있다 (필요시마다 사용가능)
JSP 내장객체(기본객체)
***= request : HttpServletRequest
1. 클라이언트가 요청한 데이터
2. 브라우저 정보
3. 데이터 추가 정보
==> getRemoteAddr() : 클라이언트의 IP
==> getParameter() : 요청값을 가지고 온다
==> getParameterValues() : 여러개의 요청값이 있는 경우
==> setCharacterEncoding() : 한글 (POST)
==> setAttribute() : 기존의 요청값 + 추가 => 전송 (MVC)
***= response : HttpServletResponse
1. 응답 정보
=> sendRedirect()
2. header 정보
=> setHeader() : 다운로드 할 때
= out : JspWriter
1. 출력 (메모리 크기 설정)
==> out.println() : 화면 출력
<%= %>
==> out.getBufferSize() : 출력하는 메모리의 실제 크기
==> out.getRemainning() : 사용하고 남아있는 버퍼 크기 확인
*= application : ServletContext
1. 서버 정보
2. 로그 정보 (*****)
==> log, getInitParameter()
3. 실제 저장되는 폴더 정보
==> getRealPath() : 그림 파일 올릴 경우에 (새로고침) => 톰캣이 실행하는 실제 경로
= pageContext : PageContext : 제어흐름(include, forward)
태그형으로 변경해서 사용
<jsp:include> <jsp:forward>
***= session : HttpSession : 서버에 클라이언트 정보를 저장
로그인처리, 장바구니, 예매처리
모든 JSP에서 사용해야되는 데이터가 있는 경우
setAttribute(): 서버에 저장
getAttribute(): 값을 읽어올 때
invalidate() : 서버에서 저장된 모든 데이터 삭제
removeAttribute() : 원하는 부분만 삭제
= page : Object => 일반 자바 => this
= config : 환경설정 ServletConfig ==> web.xml로 대체
= exception : Exception : 예외처리
=> jsp => try~catch
스크립트 요소 세 가지
스크립트릿 -> 일반 자바 <% %>
표현식 -> 출력 <%= 변수값 %>
<%= vo.getNo() %> => println(변수값)
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" buffer="6kb" autoFlush="true" %>
<%--
--%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%-- 출력하는 메모리 크기 : getBufferSize()
8kb => 8*1024 => 8192 (생략하면 8kb가 디폴트)
16kb => 16*1024 => 16384
--%>
<h1>출력하는 메모리 크기:<%= out.getBufferSize() %></h1>
<%-- 현재 남아 있는 버퍼의 크기 : getRemaining() --%>
<h1>남아있는 버퍼(메모리) 크기:<%= out.getRemaining() %></h1>
<h1>현재중인 버퍼(메모리) 크기:<%= out.getBufferSize()-out.getRemaining() %></h1>
<%-- 메모리 크기, 출력하는 메모리를 정리 : 서버개발자가 주로 사용하는 내장 객체 --%>
<%
out.println("버퍼크기:8kb"); // 서블릿 (복잡한 자바 코딩인 경우에만 사용 권장)
%>
<h1>버퍼 처리(전송=>메모리 전체 비워준다):<%=out.isAutoFlush() %></h1>
<%--
clear() : 메모리에 저장된 모든 데이터를 지울 경우
flush() : 버퍼의 내용을 클라이언트로 전송
==> 자동으로 처리가 된다 => 전송 => 메모리에 저장된 데이터를 다 지운다 autoFlush(JSP에서 자동 설정)
==> 클라이언트가 서버에 접속을 하게 되면 서버는 HTML, XML을 보내기 위해서 메모리 공간을 생성
클라이언트당 한개만 생성 (메모리에 저장, 전송완료 => true(디폴트) 지워준다)
==> 118page
--%>
</body>
</html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%-- 119page
pageContext : PageContext 클래스로부터 미리 생성된 객체(내장객체)
============
페이지 흐름 제어 : 특정부분에 다른 JSP를 첨부 : include
자주 사용 => 태그형으로 변경
액션태그 <jsp:include> <jsp:forward> ==> Spring
<jsp:include> = pageContext.include()
=============
권장 사항 => <jsp:include> ==> 자동으로 pageContext.include()변환
==> 자바하고 HTML이 분리해서 사용 ==> 태그형 프로그램
<%
for(int i=1;i<=10;i++)
{
}
%>
<c:forEach var="i" begin="1" end="10" step="1">
태그로 자바를 제어하는 프로그램 => MVC => Spring
include ==> 조립 하는 프로그램
==============
수정,추가
--%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<center>
<table border=1 bordercolor=black width=700 height=500>
<tr>
<td colspan="2" height=100><jsp:include page="include/header.jsp"></jsp:include></td>
</tr>
<tr>
<td width=150><% pageContext.include("include/login.jsp"); %></td>
<td width=550><% pageContext.include("include/content.jsp"); %></td>
</tr>
<tr>
<td colspan="2" height=100><% pageContext.include("include/footer.jsp"); %></td>
</tr>
</table>
</center>
</body>
</html>
=> include로 모아준다!
style.css
#topMenu {
height: 30px; /* 메인 메뉴의 높이 */
width: 880px; /* 메인 메뉴의 넓이 */
}
#topMenu ul {
/* 메인 메뉴 안의 ul을 설정함: 상위메뉴의 ul+하위 메뉴의 ul */
list-style-type: none;
/* 메인 메뉴 안의 ul 내부의 목록 표시를 없애줌 */
margin: 0px; /* 메인 메뉴 안의 ul의 margin을 없앰 */
padding: 0px; /* 메인 메뉴 안의 ul의 padding을 없앰 */
}
#topMenu ul li {
/* 메인 메뉴 안에 ul 태그 안에 있는 li 태그의 스타일 적용(상위/하위메뉴 모두) */
color: white;
/* 글씨 색을 흰색으로 설정 */
background-color: #2d2d2d;
/* 배경 색을 RGB(2D2D2D)로 설정 */
float: left; /* 왼쪽으로 나열되도록 설정 */
line-height: 30px; /* 텍스트 한 줄의 높이를 30px로 설정 */
vertical-align: middle; /* 세로 정렬을 가운데로 설정 */
text-align: center; /* 텍스트를 가운데로 정렬 */
position: relative; /* 해당 li 태그 내부의 top/left 포지션 초기화 */
}
.menuLink, .submenuLink {
/* 상위 메뉴와 하위 메뉴의 a 태그에 공통으로 설정할 스타일 */
text-decoration:none; /* a 태그의 꾸밈 효과 제거 */
display: block; /* a 태그의 클릭 범위를 넓힘 */
width: 150px; /* 기본 넓이를 150px로 설정 */
font-size: 12px; /* 폰트 사이즈를 12px로 설정 */
font-weight: bold; /* 폰트를 굵게 설정 */
font-family: "Trebuchet MS", Dotum;
/* 기본 폰트를 영어/한글 순서대로 설정 */
}
.menuLink {
/* 상위 메뉴의 글씨색을 흰색으로 설정 */
color: white;
}
.topMenuLi:hover .menuLink {
/* 상위 메뉴의 li에 마우스오버 되었을 때 스타일 설정 */
color: red; /* 글씨 색 빨간색 */
background-color: #4d4d4d;
/* 배경색을 밝은 회색으로 설정 */
}
.submenuLink {
/* 하위 메뉴의 a 태그 스타일 설정 */ color: #2d2d2d;
/* 글씨 색을 RGB(2D2D2D)로 설정 */ background-color: white;
/* 배경색을 흰색으로 설정 */ border: solid 1px black;
/* 테두리를 설정 */ margin-top: -1px;
/* 위 칸의 하단 테두리와 아래칸의 상단 테두리가 겹쳐지도록 설덩 */
}
.longLink {
/* 좀 더 긴 메뉴 스타일 설정 */ width: 190px;
/* 넓이는 190px로 설정 */
}
.submenu {
z-index:10;
/* 하위 메뉴 스타일 설정 */
position: absolute;
/* html의 flow에 영향을 미치지 않게 absolute 설정 */
height: 0px;
/* 초기 높이는 0px로 설정 */
overflow: hidden;
/* 실 내용이 높이보다 커지면 해당 내용 감춤 */
transition: height .2s;
/* height를 변화 시켰을 때 0.2초간 변화 되도록 설정(기본) */
-webkit-transition: height .2s;
/* height를 변화 시켰을 때 0.2초간 변화 되도록 설정(구버전 크롬/사파라ㅣ) */
-moz-transition: height .2s;
/* height를 변화 시켰을 때 0.2초간 변화 되도록 설정(구버전 파폭) */
-o-transition: height .2s;
/* height를 변화 시켰을 때 0.2초간 변화 되도록 설정(구버전 오페라) */
}
.topMenuLi:hover .submenu {
/* 상위 메뉴에 마우스 모버한 경우 그 안의 하위 메뉴 스타일 설정 */
height: 93px;
/* 높이를 93px로 설정 */
}
.submenuLink:hover {
/* 하위 메뉴의 a 태그의 마우스 오버 스타일 설정 */ color: red;
/* 글씨색을 빨간색으로 설정 */ background-color: #dddddd;
/* 배경을 RGB(DDDDDD)로 설정 */
}
section{
width:765px;
height:560px;
border:1px solid black;
display: block;
z-index: 1;
}
.main {
float: right;
width: 765px;
vertical-align: top;
}
.main .content .gallery {
font-size: 10px;
margin-top: 5px;
}
.main .content .gallery .item {
cursor: pointer;
/*background-image: url(http://placehold.it/170x240);*/
background-size: 100% 100%;
display: inline-block;
height: 180px;
width: 120px;
flex-grow: 1;
font-size: 5pt;
margin: 2.5px;
color: #000;
position: relative;
}
.main .content .gallery .item .description {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 0px;
padding: 0px;
background-color: rgba(0, 0, 0, .85);
color: white;
overflow: hidden;
transition: all .3s;
}
.main .content .gallery .item .description h2 {
color: #33CC33;
font-weight: bold;
}
.main .content .gallery .item:hover .description {
height: 30px;
padding: 10px;
}basic.3.jsp (include폴더 header, login, content, footer / board폴더 list.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>
<!-- 외부 css 파일을 읽기 -->
<link rel="stylesheet" href="style.css">
</head>
<body>
<%--
HTML 5 => HTML 4 (<div>)
시멘텍 태그 : 태그를 쉽게 찾을 수 있게 변경
====================================
<header> 회사로고 , 검색창
====================================
<nav> 메뉴 제작
====================================
|
화면 출력 section | 부가정보 (날씨, 인기검색어) aside
|
|
====================================
개인 정보 방침 , 회사 정보 => footer
====================================
템플릿을 다운 로드 (HTML4(div) ,HTML5(header,section,nav...))
정리 : CSS
--%>
<header>
</header><!-- <div class="header"> -->
<nav id="topMenu">
<ul>
<li class="topMenuLi">
<a class="menuLink" href="#">Home</a>
</li>
<li>|</li>
<li class="topMenuLi">
<a class="menuLink" href="#">레시피</a>
<ul class="submenu">
<li><a href="#" class="submenuLink">최신순</a></li>
<li><a href="#" class="submenuLink">추천순</a></li>
</ul>
</li>
<li>|</li>
<li class="topMenuLi">
<a class="menuLink" href="#">커뮤니티</a>
<ul class="submenu">
<li><a href="#" class="submenuLink">자유게시판</a></li>
<li><a href="#" class="submenuLink">자료실</a></li>
<li><a href="#" class="submenuLink">묻고 답하기</a></li>
</ul>
</li>
<li>|<li>
<li class="topMenuLi">
<a class="menuLink" href="#">요리정보</a>
<ul class="submenu">
<li><a href="#" class="submenuLink">요리팁 & 노하우</a></li>
<li><a href="#" class="submenuLink">재료</a></li>
<li><a href="#" class="submenuLink">맛집찾기</a></li>
</ul>
</li>
</ul>
</nav>
<%-- 화면 출력 --%>
<section>
<div class="main">
<div class="content">
<div class="gallery">
<!-- 이미지 출력 -->
<%
// include는 파일이 없는 경우에 오류를 발생
pageContext.include("board/list.jsp");
%>
</div>
</div>
</div>
</section>
</body>
</html>include(폴더)/header.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>
<center>
<h1>Header.jsp</h1>
</center>
</body>
</html>include/login.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>
<center>
<h1>login.jsp</h1>
</center>
</body>
</html>include/content.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>
<center>
<h1>content.jsp</h1>
</center>
</body>
</html>include/footer.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>
<center>
<h1>footer.jsp</h1>
</center>
</body>
</html>
board/list.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>
<center>
<h1>자유게시판</h1>
</center>
</body>
</html>
========================================
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%-- basic.jsp
1. appication 객체
ServletContext의 객체명
= 서버와 관련
서버에 대한 정보
= 로그정보 (log())
= 디렉토리 정보 (getRealPath()) => 톰캣이 읽어가는 실제 경로명
= 서버파일을 읽을 수 있는 권한 (web.xml) => 서블릿 등록 , 에러등록
getInitParamter()
--%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%--
Application 객체 : 서버 정보
서버 관련 메소드
getServerInfo() : 서버의 이름을 가지고 올때 ==> Tomcat8.5
getMajorVersion()
getMinorVersion()
3.1 Minor
== ==
Major
--%>
<center>
<h1>서버 정버</h1>
<ul>
<li>서버정보:<%=application.getServerInfo() %></li>
<li>메이저:<%=application.getMajorVersion() %></li>
<li>마이너:<%=application.getMinorVersion() %></li>
</ul>
<h1>web.xml에 존재하는 데이터베이스 정보를 출력</h1>
<ul>
<%--
<param-name>driver</param-name> : 키
<param-value>oracle.jdbc.driver.OracleDriver</param-value> : 값
--%>
<li>데이터베이스(Driver):<%= application.getInitParameter("driver") %></li>
<li>데이터베이스(URL):<%=application.getInitParameter("url") %></li>
<li>데이터베이스(USERNAME):<%=application.getInitParameter("username") %></li>
<li>데이터베이스(Password):<%=application.getInitParameter("password") %></li>
</ul>
<%--
서버 => 로그파일 ==> 로그를 만드는 방식 : application
--%>
<%
String driver=application.getInitParameter("driver");
String url=application.getInitParameter("url");
String username=application.getInitParameter("username");
String password=application.getInitParameter("password");
application.log("driver:"+driver);
application.log("url:"+url);
application.log("username:"+username);
application.log("password:"+password);
%>
<%--
C:\webDev\webStudy\OnLineStudy9\WebContent\jsp\basic.jsp : 가상주소
=> 프로그래머가 편집이 가능하게 만들어 주는 위치
C:\webDev\webStudy\.metadata\.plugins\org.eclipse.wst.server.core\
tmp0\wtpwebapps\OnLineStudy9\jsp\basic.jsp
=> 톰캣이 읽어가는 실제 경로명 (그림)
--%>
<h1>실제 경로명</h1>
<%= application.getRealPath("/jsp") %>
<%--
application
= getInitParameter()
= getRealPath()
= log()
--%>
</center>
</body>
</html>
==========================
정리
1) 내장 객체
request
getParameter() : 단일 값을 받는 경우
getParameterValues() : 다중값 (체크박스)
setCharacterEncoding() : 디코딩 (인코딩 =>디코딩)
response
setHeader() : 실제데이터를 보내기전에 전송하는 데이터 (header:IP,Method)
다운로드
sendRedirect() : 서버에서 사용자 요청한 파일로 이동 => GET방식을 이용한다
out
기본 메모리 크기 : 8kb
println() : 화면에 출력 ==> <%= %>
pageContext
include(): 특정부분에 다른 JSP를 포함
<jsp:include>
forward() : 원래 => 모든 JSP (request를 따로 가지고 있다)
화면이 변경이 되면 request가 초기화 (기존에 보냈던 모든 데이터 잃어 버린다)
잃어 버리지 않게 하는 방식 => forward(MVC,Spring)
application
web.xml을 읽을 경우 : getInitParamter()
log() => 모든 서버에서 로그파일 기록하고
getRealPath() : 실제 톰캣이 읽어가는 경로명 (모든 그림 파일에 여기에 존재)
error
1) error가 났을 경우에 페이지 이동 ==> errorPage="error.jsp"
모든 에러가 같은 파일을 이용한다
2) error가 났을 경우에 ==> 종류별로 처리
500,404 ==> web.xml이용처리
파일을 여러개 만들어서 처리
error 처리
=========
errorPage 처리
web.xml에 처리하는 방식
<error-page>
<error-code>404<error-code>
<location>처리하는 파일의 위치</location>
<error-page>
404 : 파일이 존재하지 않는 경우
500 : 소스에 컴파일,인터프리터에러
415 : 한글변환 코드 오류 (UTF-8 => UFT-8)
400 : 데이터 전송 (인터넷=>한글을 포함해서 보내면 400)
200(정상수행) ==> 정상수행
====================== ajax에 등장
=> session/cookie(내장 객체)
'Back-end > JSP' 카테고리의 다른 글
| JSP 6일차 - MVC / 인터페이스 (0) | 2020.10.08 |
|---|---|
| JSP 5일차 - JSTL / 망고플레이트 (0) | 2020.10.07 |
| JSP 4일차 - Express Language, JSTL / 게시판 (2) | 2020.10.05 |
| JSP 3일차 - include (0) | 2020.09.22 |
| JSP 1일차 - 웹사이트 제작 (0) | 2020.08.24 |
