2019. 11. 5. 11:06ㆍ🔴 JSP웹개발
JSP = Java(자바) + Server(서버기능을 담고 있다) + Page(HTML)
"서버 기능을 가지고 있는 자바코드 + HTML"
Servlet으로 화면구현(HTML)시 비효율적인 측면을 해결하기위해 탄생한 문서양식!
JAVA & HTML(html+css+javascript)코드가 같은 문서 내에 공존함
Servlet
JavaResources → servlet → <VsServlet.java>
package servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
@WebServlet("/vs.do")
public class VsServlet extends HttpServlet {
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//setCharacter은 get이든 post이든 항상 써주자~
request.setCharacterEncoding("utf-8");
String msg = request.getParameter("msg");
response.setContentType("text/html; charset=utf-8");
//동적으로 html페이지를 만들어줌
//태그들을 문자열로 만들어서 하나하나 넣는게 불편함!
PrintWriter out = response.getWriter();
out.println("<!DOCTYPE html>");
out.println("<html>");
out.println("<head>");
out.println("<meta charset=\"UTF-8\">");
out.println("<title>Insert title here</title>");
out.println("<script src=\'https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js\'></script>");
out.println("<body>");
out.println("여기는 Servlet<br>");
out.println("<h1>"+msg+"</h1>");
out.println("</body>");
out.println("</head>");
out.println("</html>");
}
}
WebContent → <send_msg.html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
function mySend(){
//var msg = document.getElementById('msg').value;
var msg = $("#msg").val();
//url로 호출 -> get방식
location.href= "vs.do?msg="+msg;
}
</script>
</head>
<body>
<input id="msg" placeholder="메시지를 입력"/>
<input type="button" value="msg전송" onclick="mySend()"/>
</body>
</html>
실행 → 소스코드보기:
(msg = 안녕) 입력한 값을 받아서 동적으로 html문서 만들어줌
단점: 한번에 코드가 눈에 들어오지 않아 구조파악이 어려움!!
JSP
Java Resources에서 만드는것이 아니라, WebContent에서 만듬!
WebContent → <vs.jsp>
한 파일 안에 : jsp 속성 + html파일
<vs.jsp>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
/* 자바코드 쓰기 */
/* JSP파일은 Servlet파일로 변환됨, 따라서 request가져다가 사용할 수 있음 */
String msg = request.getParameter("msg");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
여기는 JSP<br>
<!-- 자바코드 response.getWriter().println(msg) -->
<h1><%=msg %></h1>
</body>
</html>
WebContent → <send_msg.html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
function mySend(){
//var msg = document.getElementById('msg').value;
var msg = $("#msg").val();
//url로 호출 -> get방식
/* location.href= "vs.do?msg="+msg; */
location.href= "vs.jsp?msg"+msg;
}
</script>
</head>
<body>
<input id="msg" placeholder="메시지를 입력"/>
<input type="button" value="msg전송" onclick="mySend()"/>
</body>
</html>
WAR Export : web application 만들기 (war 파일) [배포하기]
-
파일 export하기 (파일: vsapp.war)
-
tomcat폴더 → webapps폴더 안에 넣기
-
tomcat실행시키기 (bin폴더 → startup.bat)
하지만, 리눅스와 같은 서버는 UI가 제공되지 않기 때문에 cmd와 같은 터미널을 이용:
Tomcat설정할때 환경변수를 설정했다! (=전역변수로 지정) → 바로 startup.bat 실행 가능 -
webapps → 'vsapp'폴더로 자동으로 압축풀어줌
-
vsapp폴더 = 하나의 프로그램, tomcat이 실행시키는 것
-
크롬을 열어 호스팅하기:
eclipse 내의 Servers
실제 tomcat 프로그램으로부터 복사해온 "가상의 서버" → eclipse가 이용하기 위해
eclipse의 tomcat이 실제로 실행시키는 (build, war파일을 만듬) 공간
좌: tomcat이 만든 클래스
우: eclipse에 내가 저장해놓은 jsp파일
→ tomcat이 우리가 작성한 jsp파일을 class로 변환시켜준다! [vs.jsp ⇒ vs_jsp.java]
'🔴 JSP웹개발' 카테고리의 다른 글
JSP(2) - JSTL(tag library)사용해서 html스럽게 코드작성하기 (0) | 2019.11.08 |
---|---|
JSP(1) - JSP 스크립트 요소 (0) | 2019.11.08 |
Servlet(4) - 서블릿의 생명주기 + 예제 (0) | 2019.11.04 |
Servlet(3) - Dynamic web module version 2.5 vs 3.1 (0) | 2019.11.04 |
Servlet(2) - 예제를 통해 서블릿이해하기, 웹 어플리케이션의 구성요소 (0) | 2019.11.03 |