JSP기초 - 자바코드 페이지 출력방법

요즘 공부에 대한 열정이 약해지고 있는 자신을 느낀다.

그 증거로 블로그정리를 거이 안하고 있었다;;;;

 

최근 정처기 필기에 많은시간을 할애해 버려서 블로그가

소홀해 진 것도 느껴진다.

 

그렇기에 다시 동기부여를 위해서 학원에서 배운JSP의 시작부터 다시 정리해 보려고 한다.   

<h1>선언부에 스크립틀릿 변수의 차이</h1>
<hr>

<%
	// declaration, 선언부
	// ISP는 컴파일되면 Servlet 클래스로 변환된 후 실행된다
	// 선언부에서는 작성될 클래스의 멤버 필드 및 멤버 메서드를 추가할 수 있다
	
	int n1 = 10;
	// n1++;'
%>

<%

	// scriptlet, 스크립틀릿
	// jsp가 서블릿으로 변환되면 service(), doGet(), doPost() 등의 메서드를 가진다
	// 스크립틀릿은 생성된 서블릿 객체가 한번의 요청을 받았을때 마다 수행되는 service() 함수이다
	// (함수 내부이므로 연산식 및 제어문을 수행할 수 있다)
	int n2 = 10;
	n1++;	// 멤버 메서드 내부에서는 멤버 필드를 참조할 수 있다
	n2++;	// 메서드 내부에서 지역변수를 참조한다

%>

<h3>n2 : <%=n1 %></h3>
<h3>n2 : <%=n2 %></h3>


<ul>
	<li>클라이언트가 요청을 한다</li>
	<li>서블릿 컨테이너에서 서블릿 객체를 생성한다</li>
	<li>받은 요청과 보낼 응답 객체를 준비한다</li>
	<li>대상 클라이언트에 관해 처리할 내용을 새로운 스레드에서 실행한다</li>
	<li>요청과 응답을 스레드에 전달하여 서블릿이 처리한다</li>
	<li>Service메서드를 통해 doGet이나 doPost같은 함수를 실행한다</li>
	<li>6의 결과로 만들어진 응답을 컨테이너로 보낸다</li>
	<li>컨테이너는 http응답을 클라이언트에게 전송한다</li>
</ul>
	<img src="servlet.png">
</body>

JSP는 HTML + 자바의 조합으로 이루어진다.

간단히 말하자면 자바에서 변수에 값을 넣어주고 그것을 JSP에서 파라메터로 받은 다음

연산 및 출력을 하는것이 주이다.

 

위 코드를 보면 <%    %> 이렇게 괄호를 치는데 이것은 자바코드를 실행하기 위한 공간이다.

이 공간에 int n2 = 10;으로 변수를 넣어주고 

<h3>n2 : <%=n1 %></h3>
<h3>n2 : <%=n2 %></h3>

자바 콘솔이 아니라 HTML페이지에 출력하고 싶다면 위 코드처럼 <%=변수 %> 이런식으로 출력이 가능하다.

 

  그럼 이제 파라메터를 보내서 받는 것을 보자.

<h1>form태그를 이용한 파라미터 전달</h1>
<hr>
<%--
	form태그는 사용자 입력값을 포함한 새로운 요청을 만들어서 서버에 전송하는 태그이다
	form 태그는 다음 속성을 사용할 수 있다
	
		action : 요청을 받을 서버의 주소
				 생략하면 언제 주소에서 요청을 받는다
				 
		method : 요청 방식 (GET, POST, HEAD, PUT, PATCH, DELETE...)
				 단, form 태그는 GET, POST, HEAD 만 사용가능하다	
				 
		POST : 클라이언ㄷ트가 입력하는 data를 서버(록온 DB)에 만들기 위한 메서드
			   입력받은 내용은 주소창을 통하여 전달하지 않는다
			   HTTP 요청 패킷의 body에 form-data 형식으로 포함되어 전달된다
 --%>


<form>
	<p><input type="text" name="name" placeholder="이름 입력"></p>
	<p><input type="number" name="age" placeholder="나이입력"></p>
	<p><input type="submit"></p>
<fieldset>
</form>
	<legend>naver로 연결되는 form</legend>
	<form action="https//search.naver.com/search.naver">
		<input type="text" name="query" placeholder="네이버 검색어 입력">
		<input type="submit" value="검색" />
	</form>
</fieldset>

<<fieldset>
	<legend>현재 서버의 ex03.jsp 로 연결되는 form</legend>
	<form action="ex03.jsp">
		<input type="text" name ="name" placeholder="이름 입력">
		<input type="submit" value="제출"></form>
</fieldset>

<%
	String name = request.getParameter("name");
	String age = request.getParameter("age");
	String msg;
	
	if(name == null || age == null || "".equals(name) || "".equals(age)) {
		msg = "안녕하세요";
	}
	else {
		msg = String.format("%s님 (%s살) 안녕하세요", name, age);
	}
%>
<h3><%=msg %></h3>

 

 

위 코드에서 봐야할 점은 어떤식으로 값이 이동하는지를 봐야한다.

<form>
	<p><input type="text" name="name" placeholder="이름 입력"></p>
	<p><input type="number" name="age" placeholder="나이입력"></p>
	<p><input type="submit"></p>
<fieldset>
</form>

여기서 보면 form태그가 사용되었다.

JSP에서 파라메터를 보내고 싶다면 form태그에 input태그를 넣어주고 그 값을 보내기 위해서 submit타입의 버튼을 만들어야 한다.

 

이렇게 해서 파라메터를 보내버리면 

<%
	String name = request.getParameter("name");
	String age = request.getParameter("age");
	String msg;
	
	if(name == null || age == null || "".equals(name) || "".equals(age)) {
		msg = "안녕하세요";
	}
	else {
		msg = String.format("%s님 (%s살) 안녕하세요", name, age);
	}
%>
<h3><%=msg %></h3>

  여기서 getParameter으로 name 과 age의 파라메터를 받아온다음

반드시 각각의 변수가 비어있지 않은지  확인해야 한다.

 

확인을 하고 난 후msg변수에 받아온 값들을 넣어주고

출력하는 방식이다.

 

<form method="POST" action="ex06-result.jsp">
	<p><input type="text" name="userid" placeholder="ID" required autofocus></p>
	<p><input type="password" name="userpw" placeholder="Password" required></p>
	<p><input type="submit" value="로그인"></p>
</form>

위 코드를 보면 method="POST"로 다른 jsp파일에 아래에 있는 값들을 파라메터에 넣어서 보내주는 태그이다.

	
<%! // 선언부에서 프로그램 진행을 위한 필드 및 메서드를 작성
	private String[] idArray = {"itbank", "test", "admin"};
	private String[] pwArray = {"it", "1234", "admin"};
	private String[] nameArray = {"원종래", "테스트", "관리자"};
	
	public String login(String userid, String userpw){
		String answer = null;
		for(int i = 0; i < idArray.length; i++) {
			if(userid.equals(idArray[i])){
				if(userpw.equals(pwArray[i])){
					answer = nameArray[i];
					break;
				}
			}
		}
		return answer;
	}
	
%>

<%
	//스크립틀릿
	String userid = request.getParameter("userid");
	String userpw = request.getParameter("userpw");
	
	String username = login(userid, userpw);
	String msg = username == null ? "로그인실패" : username + "님 환영합니다";
%>
<h3><%=msg %></h3>
<a href="ex06-form.jsp"><button>뒤로 가기</button></a>

위 코드는 변수만으로 로그인 기능을 구현하는 코드이다.

미리 변수에 계정정보를 만들어 두고

생성자를 만들어둔다.

 

for문으로 모든 변수를 불러와서 입력한 계정과 정보가 일치하면 

answer에 일치하는 이름을 넣는다.

 

<%
	//스크립틀릿
	String userid = request.getParameter("userid");
	String userpw = request.getParameter("userpw");
	
	String username = login(userid, userpw);
	String msg = username == null ? "로그인실패" : username + "님 환영합니다";
%>
<h3><%=msg %></h3>
<a href="ex06-form.jsp"><button>뒤로 가기</button></a>

그 다음 계정정보를 불러와서 람다식으로 로그인 성공,실패를  출력한다.

 

최근 바빠진것도 있어서 블로그를 정리할 생각을 못하고 있었다.

하지만 앞으로 배우는것들을 나 자신이 까먹었을때라도 찾아볼수 있도록

앞으로는 짧더라도 꾸준히 올려보려고한다.

 

그럼 오늘을 여기서 마치겠다.