SERVLET&JSP 1차시 - 기본개념 & 회원가입폼미션

Service를 제공하기 위해 Java사용

데이터를 영구적으로 유지보수하기 쉽게 Oracle SQL, NoSQL을 사용해 DB로 저장

WEB으로 HTML과 CSS, JS를 통해 웹기반으로 서비스를 구현하고 싶음

 

이 전체를 서버라는 공간 안에 다 담아서 사용할 수 있도록 해줌 => Servlet JSP (Server기반의 language)

JSP(java server page)

Servlet = 쓰는사람에 따라 50%JAVA

 

FRONT-END(WEB)

BACK-END(JAVA, DB)-Servlet jsp로 연결 (PHP, ASP 도 있음)

 

ASP : C#으로 구현

PHP : C로 구현

 

view : 요즘에 react가 나오면서 서버랑 분리됨.

 

Server : 웹 프로그래밍을 처리할 수 있는 도구

클라이언트와 서버의 Request - Response가 불안함

서버에서는 데이터가 중요함 : DB가 중요함 -> DB에 있는 데이터를 객체화해서 가져옴 MYBATIS사용

 

WAS(웹 어플리케이션 서버) 로 무엇을 썼느냐 : 톰캣을 썼다.

웹 서버(HTML&CSS담당)-웹 어플리케이션 서버(WAS : 연결, 서블릿JSP 동작하게해줌)-데이터베이스(DB)

 

--웹 어플리케이션의 동작 순서

① 사용자가 웹 브라우저의 주소 란에 특정 사이트의 주소를 입력하게 되면 웹 브라우저가 해당 웹 서버에 홈페이지를 요청하는 것이 된다.

② 해당 웹 서버에는 웹 브라우저의 요청이 있을 경우 이를 받아들여 요청한 페이지를 응답할 책임을 지고 있다. 요청한 페이지는 웹 서버에서 바로 공급되지 못하고 웹 어플리케이션 서버(WAS : Web Application Server)에서 다양한 로직이나 데이터베이스와의 연동을 통해서 완성되어야만 공급된다.

③ 웹 어플리케이션 서버(WAS)는 웹 서버가 클라이언트에게 제공할 페이지를 완성하기 위해서 이에 필요한 로직이나 데이터베이스와의 연동과 데이터 처리를 담당한다.

④ 로직이나 데이터베이스 작업 처리 결과를 웹 서버에게 보낸다.

⑤ 웹 서버는 이 결과를 다시 클라이언트 측 웹 브라우저에 응답하게 된다.

 

미들웨어(Jesus), 쿠팡(클라우드 서비스사용), 자신의 서버를 둬야함(은행서버 ,WAS)

 

--웹 어플리케이션 구성요소

구성   요소	설명
웹   브라우저	사용자(클라이언트 측)가 요청한 웹 서버의 결과를 화면에 출력해 볼 수 있도록   하는 어플리케이션이다.
웹   서버	웹   브라우저의 요청을 받아 들여서 이에 알맞은 결과를 웹 브라우저에 응답해 주는 역할을 한다. 요청에 필요한 페이지의 로직이나 데이터베이스와의 연동을   위해서 어플리케이션 서버에 이들의 처리를 요청한다. 대표적인   웹 서버의 종류로는 아파치(Apache)와 IIS(Internet Information Server)를 들 수 있다.
웹 어플리케이션 서버(Web Application Server:WAS)	요청한   페이지의 로직이나 데이터베이스와의 연동을 처리하는 부분이다. 대표적인 WAS로는 BEA사의 웹로직(WebLogic), IBM의 웹스파이어(WebSphere), SUN사의 iPlanet, Oracle 9iAS, 국산으로는 제우스(jeus) 등이 있다.
데이터베이스	데이터를   정보를 저장하는 곳 예를 들어 회원의 정보나 게시판에 올린 글에 대한 정보 등을 저장한다.

 

J2SE -> 이제 J2EE사용, J2ME는 없어짐

서블릿과 JSP는 J2EE를 구성하는 기술 중 하나이다

EJB -> SPRING으로 대체

 

J2EE : 클라이언트/서버 환경에나 웹 환경의 서버 단에서 수행되는 프로그램을 자바로 구현하고자 할 때 사용하는 자바기술

 

(웹 컨테이너 = WAS)는 서블릿과 JSP를 지원하고 있다.

Servlet과 JSP는 어떤 관계일까요?  서로 같은 것이다. 서블릿 : 자바기준 클래스로 구성 /JSP : html 마크업으로 이루어짐

JSP -> Servlet으로 변환되어 실행되는 것임. 서로 같은 내장객체를 가지고 사용됨

WAS : Tomcat사용함

 

웹 트렌드는 JSP를 안쓰고 있음 - SI업체는 JSP를 사용

 

서버 개발 언어

JSP, PHP, ASP.net, Node.js

Javascript, java – jsp& servlet - fornt

Javascript – node.js

Java – Spring  << 진입 장벽 높다 front back

Python – Django

C# - ASP.net

 

Spring은 정형화된 패턴 위주로 개발. 자유도는 낮지만 안정성은 높음. 대신 java 외에 프론트엔드에는 javaScript도 사용해야하며, DB가 SQL이든 NoSQL이든 이 부분도 Java 외에 다른 언어를 사용해야함. 개발언어 외에, 처리하는 데이터 객체도 각 스택마다 다름. SQL로 가져온 데이턴ㄴ JAVa에서 데이터 오브젝트로 처리하고, 프론트 엔드에서는 JSON으로 처리

 

Node.js는 딱히 정해진 패턴은 없으며, npm에 있는 모듈을 활용할 수 있고. JavaScript의 특성상 자유롭게 개발할 수 있다.

 

Spring은 엔터프라이즈급 프로젝트에 적합하다고 하고,

 

Node.js는 빠르게 개발하는 프로젝트나 프로토타입에 적합하다고 생각합니다.

 

Node.js 는 single thread인데 한 개의 thread가 많은 작업을 할 경우 느려지는 문제가 있는데. 이 경우 우리 프로젝트에서는 단순하게 호출 저장 응답 등이라 문제 없어 보인다. 다만, 예기치 못한 데이터 문제로 죽을 수가 있다는 것 정도

 

Spring의 경우 안정적이다. Java 개발언어다. 진입 장벽이 있다.

 

web content - 가상의 폴더

• 웹 브라우저를 기동하여 주소란에 다음과 같이 입력한다.

http://localhost:8181/servlet/HelloWorld

• “Tomcat9\webapps\ROOT\WEB-INF\classes" 폴더에서 HelloWorld.class 서블릿 파일을 찾는다.

 

 

--환경설정하기

c:\ -> tomcat9

JAVA EE -> Preferences -> Server -> Runtime Environments ->Apachi tomcat 9.0 -> tomcat9

Servers 우클릭 ->new -> server ->tomcat 9.0

 

--서블릿 프로그램 작성법

부모가 Servlet인 것을 상속받으면 가능

 

 

Get : 그 외의 모두

POST : form, ajax

 

입출력스트림 response o - 클라이언트측에 잘 작동o

 

주문요청에 대한 서비스 하나에 대한 처리 = 서블릿 하나(어떤 URL로 요청할 때 서블릿이 요청되기를 바람)

모든 servlet은 URL mapping이 되어있어야 함!!

 

http://localhost:8081/프로젝트명(Context)(생략가능)/HelloServlet(URL mapping)

 

httpServlet을 상속받고 메소드들을 오버라이딩하면 원하던 것을 구현할 수 있음

 

아파치 라이브러리 실종되었을때!!

Edit => Buile Path => Libraries => add libraries => tomcat 9.0 finish

 

Servers -> server.xml : 포트수정 63번째 라인 152번에 context docBase, path경로!!

<context>는 프로젝트를 실행할때마다 추가됨.

 

servlet = 뷰를 처리하는데 한계가 있음 =>java 언어

그래서 jsp많이 사용함 =>html 마크업언어

 

 

jsp를 실행시키면 이것이 결국 서블릿으로 변환되어 서블릿이 실행되는 것임

jsp - 비즈니스를 처리하기 어려움. 뷰랑 비즈니스랑 섞임

model1 : jsp -> 서블릿

서블릿-비즈니스 처리해서 -> jsp이 출력함   (MVC : model2)

 

 

--서블릿 기초 (멀티스레드) : 동시접속자

 

 

※ 500에러 = 서버에러(서블릿이 컴파일하는 과정에서 문제가 발생하는 에러)

 

---form2.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>

<form action="/JSP/FormServlet" method="post"> <!-- 프로젝트명/servlet -->

숫자 1: <input type="text" name="num1"><br>

숫자 2: <input type="text" name="num2"><br>

<input type="submit" value="계산">

</form>

</body>

</html>

--FormServlet.java

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

int num1 = Integer.parseInt(request.getParameter("num1"));  //값을 가져올때

int num2 = Integer.parseInt(request.getParameter("num2"));

int result = num1 + num2;

 

request.setAttribute("result", result);

RequestDispatcher re = request.getRequestDispatcher("/jsp/form2.jsp");

re.forward(request, response); //페이지를 넘겨주는 역할

}

--result.jsp

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

결과1 합 : <b>${result}</b>  <!-- EL태그 -->

</body>

</html>

!!서블릿에서 jsp로 보내고 싶음

**Dispatcher :  새로운 request가 아님, 이전의 request의 확장 (경로가 result.jsp가 아닌 FormServlet으로 끝)

**Redirector :  새로운 request

form.jsp -                        >  FormServlet                        -> result.jsp

                 요청(FormServlet)                    Dispatcher : 동일페이지

 

request객체(유효범위 : 요청하는 페이지까지)에 데이터를 담아서 다시 result.jsp로 넘겨주고싶다

-> redirect하는 순간 다음의 result.jsp에 동일한 데이터가 넘어가지 않음

-> dispatch하면 다음의 result.jsp에도 동일한 데이터가 넘어짐

 

EL태그 ${result}

 

jsp : 화면출력가능

 

1. Web Application (쿠팡)-> Buiness Logic(Server Logic)

2. WAS (tomcat) -> servelet/JSP -> 실행환경제공(구동)

3. Servlet/JSP 관계 =>본질은  동일하다. 용도에 따라 다르게 쓰는 것 (view보기 위한 것 : jsp, business : servlet)

4. 실행과정 :  JSP ----  (WAS : 변환해줌) --->  Servlet   ---- (컴파일)   ----->class  ----(생성)---->Servlet객체생성

                 새로운 프로그램 생성 :        (생략 : 속도빠름)                                                                                ----->Servlet객체생성) => 멀티스레드 완성

1. Servlet개발과정 : 1. HTTPServlet상속 2. URL mapping 3. doGET/doPOST 메소드 생성 4. Business구현

 

 

Business Logic / Presentation Logic (View)

 

WAS/ Container가 실행되기 전에 알아야 할 것을 지시자라고 한다 <%@ page>

 

<%@ include> 지시자

<jsp : include> 액션태그

 

액션태그 : 기능구현

<jsp : foward>    -> 원래 있는 액션태그  <% %>안써도됨

<c : > < fmt : > 사용자정의 액션태그 -> taglib 지시자 사용해서 정의 해줘야 함

 

doGET/ doPOST : request, response를 사용할 수 있게 해주는 메소드

JSP페이지에서 선언하지 않고도 사용가능한 변수 : 내장 변수(request 내장변수,  out내장변수) = 9개

 

--form2.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>

<form action="form2_!.jsp" method="post"> <!-- 프로젝트명/servlet -->

숫자 1: <input type="text" name="num1"><br>

숫자 2: <input type="text" name="num2"><br>

<input type="submit" value="계산">

</form>

</body>

</html>

 

--form2_!.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>

<%

int num1 = Integer.parseInt(request.getParameter("num1"));  //값을 가져올때 기본값 문자열로 가져와짐

int num2 = Integer.parseInt(request.getParameter("num2"));

int result = num1 + num2;

request.setAttribute("result", result);  key, value값

%>

 

<jsp:forward page ="result.jsp"/>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

결과2 : <b>${result}</b>  <!-- EL태그 -->

</body>

</html>

 

 

--result.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>

결과3 합 : <b>${result}</b>  <!-- EL태그 -->

<b><%=result %></b>

</body>

</html>

 

--한페이지에 모두 출력하기

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

    pageEncoding="UTF-8"%>

   

   

    <%

    int num1 = 0;

    int num2 = 0;

   

    if(request.getParameter("num1") != null){

    num1 = Integer.parseInt(request.getParameter("num1"));

    num2 = Integer.parseInt(request.getParameter("num2"));

    }

    int result = num1 + num2;

    request.setAttribute("result", result);   //key, value

    %>

   

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

<form  method="post"> <!-- 프로젝트명/servlet -->

숫자 1: <input type="text" name="num1"><br>

숫자 2: <input type="text" name="num2"><br>

<input type="submit" value="계산">

</form>

결과2 : <b><%=result %></b>  <!-- EL태그 -->

</body>

</html>

 

 

!!배열출력

<%@ 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>

<%

if(request.getParameterValues("hobby")!=null){

    String hobby[] = request.getParameterValues("hobby"); ->배열이 넘어옴

    for(int i=0; i<hobby.length;i++){

    out.print(hobby[i] + ", ");

    }

}

%>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

<form   method="post"> <!-- 프로젝트명/servlet -->

취미 : <input type = "checkbox" name = "hobby" value = "baseball">야구

<input type = "checkbox" name = "hobby" value = "basketball">농구

<input type = "checkbox" name = "hobby" value = "soccer">축구

<input type="submit" value="계산">

</form>

</body>

</html>

 

 

!!send =>

response.sendRedirect("result.jsp");

redirect => 데이터 다른 jsp로 전달불가

 

 

 

ì¼êµ¬, ë구,

취미 : 야구 농구 축구

-> 한글깨짐방지

request.setCharacterEncoding("utf-8");

 

<input type = "checkbox" name = "hobby" value = "야구">야구

 

 

 

C:\JavaDev\WorkSpace\jsp_work\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\JSP\message\notice.txt(실제 데이터 저장장소)

 

 

--application.jsp

<%@page import="java.io.FileReader"%>

<%@page import="java.io.BufferedReader"%>

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

    pageEncoding="UTF-8"%>

 

<%

String path = "/message/notice.txt";

String fullPath = application.getRealPath(path);

//out.println(fullPath);

try{

BufferedReader br = new BufferedReader(new FileReader(fullPath));

String str = "";

while((str=br.readLine()) != null){//한줄씩 읽어옴

out.println(str + "<br>");

}

}catch(Exception e){

e.printStackTrace();

}

%>

 

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

</html>

 

 

**내장객체 : Page, Request(내가 요청하는 페이지까지 살아있음->dispatch&redirector), Session, Application(톰캣서버가 꺼질때까지)

데이터를 담을 수 있는 내장객체 & 데이터의 scope까지 나타냄

->setAttribute() & getAttribute() : 데이터의 유통기한을 나타냄!

 

오늘 과제 - 폼미션!!

 

--formMission.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>

 

<form action = "../jsp/join.jsp" method = "post">

<h1>폼 미션</h1>

<caption>기본정보 입력</caption>

 

 

<table width = "450" border = "1" cellspadding = "0" cellspacing="0">

  <tbody>

    <tr height="50" align="center">

    <td>이름</td>

    <td align="left">

    <form action = "서버의 주소" method = "get/post">

   

<input type = "text" name = "name"

autofocus = "autofocus" placeholder = "ex)홍길동">

      </td>

     

    </tr>

   

      <tr height="50" align="center">

      <td>아이디</td>

      <td align="left">

<input type = "text" name = "id"

autofocus = "autofocus" >

<button type ="submit">중복확인</button>

 

      </td>

    </tr>

      <tr height="50" align="center">

      <td>비밀번호</td>

      <td align="left">

 

<input type = "password" name = "password"

autofocus = "autofocus" >

      </td>

    </tr>

      <tr height="50" align="center">

      <td>비밀번호 확인</td>

      <td align="left">

 

<input type = "password" name ="password" 

autofocus = "autofocus" >

<!-- name은 서버에 전송해주는 것 , sname은 입력값-->

 

      </td>

    </tr>

      <tr height="50" align="center">

      <td>이메일</td>

      <td align="left">

 

<input type = "text" name ="EmailId"

required = "required">

@

<select name = "address" id="seladdress">

<option value = "선택하세요">선택하세요</option>

<option value = "daum.net">daum.net</option>

<option value = "naver.com">naver.com</option>

<option value = "gmail.com">gmail.com</option>

</select>

 

      </td>

    </tr>

      <tr height="50" align="center">

      <td>연락처</td>

      <td align="left">

<input type = "text" name = "phoneNumber" size ="15" maxlength = "13"

autofocus = "autofocus" placeholder = "010-0000-0000" >

<!-- name은 서버에 전송해주는 것 , sname은 입력값-->

      </td>

    </tr>

      <tr height="50" align="center">

      <td>메일수신여부</td>

      <td>

<input type="radio" name="yesno" value ="받음">받음

<input type="radio" name="yesno" value ="받지않음">받지않음

      </td>

    </tr>

      <tr height="50" align="center">

      <td>관심분야</td>

      <td>

<input type="checkbox" name="field" value="자바">자바

<input type="checkbox" name="field" value="C++">C++

<input type="checkbox" name="field" value="파이썬">파이썬

<input type="checkbox" name="field" value="안드로이드">안드로이드

 

      </td>

    </tr>

   

   

   

  </tbody>   

  </table>

 

 

  <input type = "reset" value ="취소">

    <input type = "submit" value ="저장">

 

 

</form>

</body>

</html>

 

 

--join.jsp

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

    pageEncoding="UTF-8"%>

   

<%request.setCharacterEncoding("utf-8");%>

<%

String name = request.getParameter("name");

String id = request.getParameter("id");

String password = request.getParameter("password");

String EmailId = request.getParameter("EmailId");

String address = request.getParameter("address");

String phoneNumber = request.getParameter("phoneNumber");

String mailConsent = request.getParameter("yesno");

 

%>   

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

<h3><%=name %></h3>

<h3><%=id %></h3>

<h3><%=password %></h3>

<h3><%=EmailId +"@"+address%></h3>

<h3><%=phoneNumber %></h3>

<h3><%=mailConsent %></h3>

<h3><%

if(request.getParameterValues("field")!=null){

String field[] = request.getParameterValues("field");

for(int i=0; i<field.length;i++){

out.print(field[i]+", ");

}

} %></h3>

</body>

</html>

 

--출력창(http://localhost:8081/JSP/jsp/join.jsp)

홍길동

 

meghan

 

1234

 

meghan@naver.com

 

010-1234-5678

 

받음

 

자바, C++,