JSP / Servlet - 1 (기초) + 네트워크

2023.06.08

● 네트워크

- 두 대 이상의 컴퓨터가 연결되어 통신하는 것

* 웹프로토콜 - HTTP
- 약속된 데이터 형식

* 허브(중앙에 위치한 장치)
컴퓨터마다 복잡하게 선을 연결하지 않고 허브 하나로 연결함

* 스위치(관리 기능을 집어넣은 지능형 허브)
데이터 방향 전환이 가능한 장치
특정 컴퓨터에만 데이터를 전달 할 수 있음
보안기능

* 라우터
- 나라별로 네트워크를 교환하기 위한 장치
- 각 다라를 대표하는 장치(중개네트워크)
- ISP(Internet Service Provider) : 다른 네트워크와 연결해주는 라우터가 있는 것

* 로컬호스트

- 127.0.0.1
- 개인의 네트워크(내 PC주소)

* 표준 프로토콜 (TCP/IP)
인터넷에서 다른 컴퓨터와 데이터를 주고받을 수 있음
원하는 서버에 도달해 내 컴퓨터 화면에 페이지를 띄워줄 때까지 TCP/IP의 약속에 따라 진행됨
4단계가 있음 (응용, 전송, 인터넷, 이더넷)

4단계를 걸쳐 캡슐화를 하고 4단계를 거져 캡슐화를 풀어야 데이터를 보내고 읽을 수 있음

* 응용계층프로토콜 : 웹방식(컨넥션리스트)
* TCP는 전송의 역할
* 이더넷 : 물리적 공간

* LAN : 같은 지역
* WAN : 다른 지역(넓은 지역)

* 네트워크 주소형식
프로토콜종류://서버주소[:포트번호]/서브폴더| 웹앱의 경로/웹앱 | 리소스파일
url(Uniform Resource Location) : 위의 주소와 같이 서버가 어디에 있고 어떤 자원을 가지고 있는지를 가르키는 긴 주소, 웹 주소라고 함
uri(Uniform Resource Identification) : url과 비슷하나 서버가 아닌 일부주소만 가지고 현재 작업의 내용을 가르키는 상대주소, 특정 리소스를 식벽하는 통합 자원 식별자를 의미

프로토콜종류 : 네트워크를 통하여 데이터를 주고 받을때 서로 소통이 되려면 약속형식이 필요하다
예) HTTP : 웹, FTP : 파일공유, mailto : 이메일, jdbc:mariadb(데이터베이스 종류) : jdbc용

:// : 프로토콜종류와 서버(ip | dns) 구분기호
포트번호 : 서버에서 통신에 사용하는 문
/ : 서버주소 컴퓨터의 루트폴더를 의미
서브폴더 | 웹앱의 경로 : 실제루트폴더 다음의 서브폴더이거나 웹에서 동작하는 프로그램(jsp\스프링)
/웹앱 | 리소스파일 : 실행기능의 웹앱프로그램(jsp/스프링) 이거나 실제파일

※ 기술
* 쿠버네티스 : 컨테이너를 오케스트레이션하는 도구

- 다수의 컨테이너 구동
* 도커 : 컨테이너 기반의 오픈소스 가상화 플랫폼

※ 인프라 구축 기술
* 클라우드
* 블록체인
* 메타버스

● jsp

★ 시작 전 설정
▶ 서버런타임 설정

- 시작줄에 빨간줄 Multiple~~에러뜨면 서버런타임 에러가 발생한 것

1. 빌드패스들어가서 서버런타임이 있는지 확인

2. 서버런타임이 없다면 모듈패스가 더 큰 범위이므로 묘듈패스에 등록하기
- 클래스 패스는 해당 클래스에만 적용됨

Add Library

3. Project Facets들어가서 Details에 나온 기준인 java 1.8이상인지 확인
- 17ver 이므로 문제 없음

4. Runtimes에서 빌드패스에서 추가한 Apache Tomcat 체크
해결 !

※ 해결이 안된다면 버그가 발생한 것이니 첫 줄을 복사 붙여넣기하고 기존 내용을 지워서 다시 실행하기

▶ 유니코드 자동설정
1. Window > Preference > enc 검색

- 웹 관련 utf-8로 변경

-> Content Types의 encoding Update하기

->Text css html / jsp 하위까지 encoding 변경

- Workspace 변경

● JSP Servlet 기초

○ post / get 방식

▶실습

1. 다이나믹웹프로젝트 만들기

- name : JSPStudy > next > next 상자체크(기본 웹 설정) > finish

- webapp : 화면
- WEP-INF : 보안, 외부에서 보이지 않음
- web.xml은 WEP-INF가 외부에서 보이지 않게해주는 파일

2. JSP File 만들기

* webapp 오른쪽 > New > Other > JSP File
- name : hello.jsp
- hello.jsp 파일을 열어 UTF-8 설정

※ 동적영역

<%@ page language="java" contentType="text/html; charset=${encoding}" pageEncoding="${encoding}"%>

<% %> : 서버에서 실행하는 태그 명령, 자바로 서버(실행 위치)에서 돌아감
<% page %> : 지금 만들고 있는 (스크립트)문서
<% page language="java" %> : 개발언어가 자바
<% page language="java" contentType="text/html; charset=UTF-8" %> :
- contentType요소는 문서의 종류를 mime (마임)타입으로 표기. 마임타입은 큰분류/세부종류형식으로 표시
ex)text/html : 텍스트 파일이고 내용은 HTML 형식문서
- charset 요소는 문자코드가 유티코드 형식 지금은 UTF-8(유니코드)이외에는 거의 사용하지 않음
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> :
- 현재 문서의 서버쪽 문자코드는 유니코드다
- @ 디렉티브 태그 : 설정 값을 준다, 지시어

※ 정적영역
< > : 클라이언트에서 돌아감

3. hello.jsp 작성

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Hello JSP</title>
</head>
<body>
	<form action="Study" method="post">
		<label>이름 : </label>
		<input type="text" value="황진이" /><br />
		<label>비밀번호 : </label>
		<input type="password" value="12345" /><br />
		
		<input type="submit" value="전 송" />
	</form>
</body>
</html>

- 웹은 요청을 해야 동작을 한다
- 웹브라우저에서 요청하면 서버는 html코드를 만들고 웹브라우저로 반환이 되며 웹브라우저에서 실행을 함
- 실행시 문제 발생한다면 백엔드와 클라이언트가 공존하고 있어서 실행순서에 문제

※ form
- 내부의 내용이 서버에 넘어감
- 데이터를 입력하기위한 양식을 모아놓은 장소
- 블럭태그
- method="post" | method="get"

※ input type
text : 문자열을 입력받아라
password : 문자열을 입력받되 화면에 보이지 않게
submit : 서버로 보내라
* <br> 줄바꿈(단일태그지만 가독성/호환성을 위해 닫는태그를 작성하기)

4. JSPStudy 프로젝트에서 Run as
* 404에러 발생

-> 요청한 페이지를 찾지 못했다

1) 다이나믹 웹프로젝트에서 실행하려면 시작파일(ex. index.jsp)가 있어야 함

- index.jsp를 만들면 404에러가 안뜸

<%@ 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>시작페이지 입니다.</h1>
<a href="hello.jsp">안녕. ヾ(≧▽≦*)o</a>

</body>
</html>

- 시작페이지는 기본적으로 index라는 이름을 사용
- 윈도우계열에서는 default라는 이름을 사용하기도 함
- index라는 이름을 가지고 확장자가 html 또는 htm을 정적시작페이지라고 함

- 원하는 링크로 들어가는 a태그 존재

2) 특정 페이지로 접근을 해야함

- hello.jsp 파일에서 실행
hello.jsp 특정 페이지에 접근하니까 실행이 됨

* (참고) index.jsp를 WEP-INF로이동하면 404 에러가 다시 뜸

- WEP-INF는 외부에서 접근할 수 없는 보안구역이기 때문에 접근이 안되어 에러 발생

-> 다시 webapp으로 이동

※ 에러 종류 정리
200 : 성공, 서버가 요청한 페이지를 잘 처리하였음
300 : 접근 불가(제한)
404 : 요청 경로 찾을 수 없음
500 : 서버 내부 오류, 웹 서버가 요청사항을 수행할 수 없을 경우 발생 ex) 자바문법오류, 지원되지 않는 문법 사용 등

※ JSP의 주석 종류.
* HTML(클라이언트)주석 | 서버주석

- JSP스크립트 코드를 사용할때 자바주석
코드안에서는 자바이므로 //, /* ~ */ 모두 사용 가능

- 백엔드 태그(%로 구분) 밖에서는 HTML주석만 보임

<%-- 서버주석 --%>

두개로 사용

* %가 있으면 실행장소는 서버
<> 클라이언트에게 보내지는 코드

* 클라이언트에서는 동적 영역 <% %>이 보이지 않음

* xml 형식 : 시작태그와 닫는태그로 규격화
닫는태그가 필요 없는 경우(내용이 없는 경우)
<br /> : 뒤에 내용 없음을 알림(닫는 태그)

※ 포트번호 충돌로 실행이 안된다면 포트번호 변경하기
하단의 Servers의 톰캣 더블클릭하면 뜨는 화면의 포트번호 설정
Tomcat admin (8005->9005)
HTTP (8080->9000)

● HTTP Method

- 클라이언트가 서버로 요청을 보내는 방법(Form을 보낼때)

- 클라이언트와 서버 사이에 이루어지는 요청(Request)과 응답(Response) 데이터를 전송하는 방식

* method="post"

- 전달한 데이터 처리/생성 요청 메서드

- 메시지 바디(body)를 통해 서버로 요청데이터를 전달하면 서버는 요청을 처리하여 업데이트
- 택배와 유사

- 클라이언트에서 서버로 정보를 제출함(서버에 데이터 추가, 작성 등)
- 새로운 데이터를 만들고 그 데이터를 보호해야할때 사용
- 외부로 노출이 되지 않음

* method="get"

- 리소스 취득

- 서버로부터 데이터 취득
- 이미 있는 데이터를 요청할때

- 주소에 경로가 보임

▶ 실습
* hello.jsp 실행
- 주소 : http://localhost:9000/JSPStudy/hello.jsp
-> 포트가 달라짐(변경해서)

* form 작성하여 전송버튼을 누르면

- 주소 : http://localhost:9000/JSPStudy/Study

- 404에러 발생
-> Study의 주소가 없기때문에 발생

-> Study라는 서블릿(자바실행파일)이 필요

- action="Study" : Study라는 서블릿(자바실행파일)로 전송
* action : 가야할 방향(서블릿의 이름을 적음)

- submit계열의 태그가 있어야 form을 서버로 전송 가능(submit, button)
- index.jsp에서 hello.jsp를 연결하는 <a></a> 작성

<a href="hello.jsp">안녕. ヾ(≧▽≦*)o</a>

▷ JSPStudy서블릿 만들기
- 서블릿은 서버에서 실행되다가 웹 브라우저에서 요청을 하면 해당 기능을 수행한 후 웹 브라우저에 결과를 전송

- 컨트롤러 역할

- 동적인 처리 가능

- JAVA코드 안에 HTML 코드, 하나의 클래스로 이루어짐
* mappings : 웹으로 접근하는 주소

-> JSPStudy 클래스가 생김

package choongang.web.jsp;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class JSPStudy
 */
@WebServlet("/Study")
public class JSPStudy extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public JSPStudy() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		System.out.println("doGet() 실행");
		response.getWriter().append("Served at: ").append(request.getContextPath());
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		System.out.println("doPost() 실행");
		doGet(request, response);
	}

}

@WebServlet("/Study")
웹브라우저에서 해당주소로 접근을 하면 해당 클래스가 객체화되어 작동
어느 주소로 들어오는지 체크하여 대응하면 객체화 됨

action의 주소와 이름이 일치하여야함 /Study

요청이 오면 JSP 또는 자바앱이 실행이 됨
서블릿컨테이너(버츄얼머신)이 대신 시행해줌
-> tomcat이 대신 실행

* 작업수행 메소드
- doGet 메소드는 jsp파일에서 method="get" 방식으로 보내면 실행
get은 url에서 확인 가능
데이터를 주소창(헤더)에 포함하여 전송
길이제한이 있음

- doPost 메소드는 jsp파일에서 method="post" 방식으로 보내면 실행
post는 url에 전송한 값이 나타나지 않음
주소창으로 전달하는 것이 아니라 문서요청 바디 안에 값들이 전달

* 서블릿은 요청에 대한 기능을 수행한 후 결과를 반환하여 클라이언트에 전송한다.
- 동작 방식
1. 클라이언트 요청(url 입력)
2. HttpServletRequest, HttpServletResponse 객체 생성
3. Web.xml이 어느 서블릿에 대해 요청한 것인지 탐색
4. 해당하는 서블릿에서 service() 메소드 호출
5. doGet() 또는 doPost() 호출
6. 동적 페이지 생성 후 ServletResponse 객체에 응답 전송
7. HttpServletRequest, HttpServletResponse 객체 소멸

* 서블릿과 JSP의 차이

서블릿은 자바 소스코드 속에 HTML코드가 들어가는 형태인데,

JSP는 이와 반대로 HTML 소스코드 속에 자바 소스코드가 들어가는 구조를 갖는 웹어플리케이션 프로그래밍 기술이다.

▶ 실습

1. index.jsp(시작페이지)에 연결 링크 추가

<body>
<a href="add.jsp">덧셈</a>
</body>

2. jsp 파일 만들기 : add.jsp

- method는 post로 작성

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>1 + ... + 5 = ? </title>
</head>
<body>
	<form action="add" method="post">
		<label>1 + ... + 5 = </label><br/>
		<input type="submit" value="더하기 결과" />
	</form>
</body>
</html>

* action="add" : add라는 서블릿을 불러라
현재위치(실행한 jsp 파일과 같은 위치에서 시작)의 add라는 웹서비스를 실행하라는 의미
보통 웹서비스는 서블릿을 의미하고 자바클래스를 의미함

3. 서블릿 만들기

* 서블릿 = 자바클래스는 main아래 java폴더에 있음

@WebServlet("/add")

- doPost만 생성

package choongang.web.jsp;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Add
 */
@WebServlet("/add")
public class Add extends HttpServlet {
	private static final long serialVersionUID = 1L;
	// 멤버변수
	private int x1;
	private int x2;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
	// 생성자(멤버변수 초기화)
    public Add() {
        super();
        // TODO Auto-generated constructor stub
        x1 = 1;
        x2 = 5;
        
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		response.getWriter().append("Served at: ").append(request.getContextPath());
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		String msg = "1 + ... + 5 = " + add();
		
		response.getWriter().append(msg);
		// doGet(request, response);
	}
	
	private int add() {
		var sum = 0;
		for (var i = x1; i <= x2; i++) {
			sum = sum + i;
		}
		
		return sum;
	}

}

- extends HttpServlet 상속은 필수

- serialVersionUID 해당패키지와 관련있음을 증명하는 코드
- getWriter() : 브라우저에게 출력하는 스트림을 얻음

* 서블릿은 flush()효과가 내장되어있음
- (참고)수동으로 하는 경우
마지막으로 보내는 내용으로 종료를 하고싶을때
스트림에 문자가 남아있으면 안되어 계속 전송이 됨

※ Add는 상대주소
* 상대주소 : uri 표기
- 상대주소 해석법 :
파일이름이나 폴더이름만 있으면 현재위치의 파일(폴더)을 의미

. : 현재위치
./ : 지금위치 이하
./sub : 현재위치 아래 자식폴더 sub
.. : 현재위치의 부모(한계층 위) 폴더
../ ../ : 현재위치의 두 계층 위 부모폴더

* 절대주소 : url 또는 /(=웹루트) 이하 주소

* 타입추론기능
var : 가변
-> 데이터 형을 나중에 판단

* 동사로 객체(클래스) 이름으로 짓지 말고 명사화하기

* html은 대소문자 구분을 하지 않지만 action은 대소문자 구분함

JSP
프론트와 백엔드가 접목이 되어 진행
스프링부트(스프링의 제품화) 이용
서블릿은 스프링부트의 하위기반

실행코드 = 앱

웹랜더링 : 어떤 파일의 내용을 읽어서 웹 화면에서 실행

웹앱 : 결과 화면이 있음
웹서비스 : 결과 화면이 없음(중간매체)
-> 사실은 같은 것으로 볼 수 있음

웹서비스의 데이터를 생산하는 것 : 백엔드
웹서비스의 데이터를 가지고 화면을 만드는 것 : 프론트엔드

'백엔드 > JSP & Servlet' 카테고리의 다른 글

JSP - 4 (세션 + 네트워크) (0)	2023.06.19
JSP / Servlet - 3 (회원가입 폼 만들기, 쿠키) (0)	2023.06.14
JSP / Servlet - 2(기초) (2)	2023.06.14
JSP / Servlet - 0 (아파치 톰캣 설치) (0)	2023.06.13