2024.01.17(수)
최근 ClipReport를 구매해 개발을 진행하는 프로젝트를 진행하고 있다.
jsp를 사용하기 때문에 jsp에 대해 좀 살펴보았고, 기록으로 남기려고 한다.
JSP(JavaServer Pages)란?
JSP(JavaServer Pages)는 1999년에 Sun Microsystems(현 오라클)에서 개발되었고,
이 기술은 웹 애플리케이션 개발에서 서블릿의 불편함을 해소하고 더 편리한 방식으로 동적인 웹 페이지를 생성하기 위해 만들어졌다.
특징
JSP(JavaServer Pages)는 Java 언어를 기반으로 하는 서버 측 웹 개발 기술 중 하나이다.
동적 웹 페이지를 생성하는 데 사용되며, HTML 코드 안에 Java 코드를 삽입하여 웹 애플리케이션을 만들 수 있다.
기본적으로 JSP는 클라이언트의 요청에 대한 응답으로 동적인 웹 페이지를 생성하는 데 사용된다.
JSP 페이지는 일반적으로 .jsp 확장자를 가지며, 서블릿으로 변환되어 실행되고, 이때 JSP 엔진은 JSP 페이지를
자바 서블릿 코드로 변환하고, 그것을 컴파일하여 실행한다.
JSP 페이지 안에는 HTML 코드뿐만 아니라 <% %> 태그 사이에 Java 코드를 넣을 수 있다.
이를 통해 동적인 콘텐츠를 생성하고 데이터베이스와 상호 작용하는 등의 서버 측 로직을 구현할 수 있다.
예를 들어, 다음은 간단한 JSP 페이지의 예:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSP 예제</title>
</head>
<body>
<h1>Hello, <%= request.getParameter("name") %>!</h1>
</body>
</html>
위의 예제에서 <%= request.getParameter("name") %> 부분은 클라이언트가 전송한 "name" 매개변수를 받아와
동적으로 출력하는 부분이다.
* JSP는 Java 웹 애플리케이션 개발에서 널리 사용되며, 자바 기술 스택의 일부로써 다양한 웹 프로젝트에서 활용된다.
JSP 통신
JSP 한 페이지에서 java와 javaScript 통신 예제
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSP 및 JavaScript 예제</title>
<script>
function sendData() {
// JavaScript에서 입력 값을 가져옴
var userInput = document.getElementById("userInput").value;
// XMLHttpRequest 객체 생성
var xhr = new XMLHttpRequest();
// POST 방식으로 데이터를 보낼 주소 설정
xhr.open("POST", "<%= request.getContextPath() %>/index.jsp", true);
// 보낼 데이터의 타입 설정
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
// 데이터 전송
xhr.send("userInput=" + userInput);
// 응답을 처리하는 함수 등록
xhr.onreadystatechange = function() {
if (xhr.readyState == XMLHttpRequest.DONE) {
if (xhr.status == 200) {
// 응답이 성공적으로 도착하면 결과를 출력
document.getElementById("result").innerHTML = xhr.responseText;
} else {
// 에러 처리
console.error("Error: " + xhr.status);
}
}
};
}
</script>
</head>
<body>
<h1>JSP 및 JavaScript 통신 예제</h1>
<label for="userInput">사용자 입력:</label>
<input type="text" id="userInput">
<button onclick="sendData()">전송</button>
<div id="result"></div>
<%
// POST 방식으로 전송된 데이터 받기
String userInput = request.getParameter("userInput");
// 받은 데이터를 출력
if (userInput != null && !userInput.isEmpty()) {
out.println("<h2>사용자 입력값: " + userInput + "</h2>");
}
%>
</body>
</html>
페이지 안에서 JavaScript와 JSP 코드를 함께 사용하여 데이터를 주고받고,
사용자가 입력한 값을 JavaScript로 받아와 JSP로 전송하고, JSP에서는 전송된 데이터를 출력한다.
'개발일기' 카테고리의 다른 글
| 07. DOM(Document Object Model) (63) | 2024.01.23 |
|---|---|
| 06. 자바(Java) 이미지 파일 (60) | 2024.01.22 |
| 04. 자바스크립트 eval() 함수 (35) | 2024.01.11 |
| 03. 빌드(build) (36) | 2024.01.08 |
| 02. 이클립스(Eclipse) VS STS(Spring tool Suite) (27) | 2024.01.03 |
