📝Server 중 JSP 공부 및 실습
#230320
JAVA코드가 들어가 있는 HTML 코드
1. 이클립스에서 Dynamic Web Project용 프로젝트 만들기
만드는 과정은 Servlet 당시 만들던거랑 동일함.
2. 이클립스 👉 VS CODE 이동,
VS CODE 해당 프로젝트 폴더로 변경
3. webapp
폴더 안에 index.html
파일 생성
3-1. webapp
- temp
폴더 생성 - test1.html
파일 생성
4. 최종 결과물이 보여질 index.html
보여질 화면에 대한 코드 작성
/프로젝트명(JSPProject)/서비스요청주소(login) / 데이터 전달방식(get/post) <form action="/JSPProject/login" method="post">
5. src/main/java
-edu.kh.jsp.controller
안에서 .java 클래스 만들기
6-1. 클래스 생성 후 클래스 이름 바로 위에
어노테이션 @WebServlet("/서비스요청주소") 써주고 import
6-2 생성 클래스 바로 뒤에 extends HttpServlet
구문 작성
6-3 (get/post방식) 오버라이딩 해주기
7. post 방식의 경우 요청 데이터 문자 인코딩 처리 구문 작성
req.setCharacterEncoding("UTF-8");
8. 전달받은 파라미터(input 태그값) 얻어와 변수에 저장
👉 파라미터는 모두 String 타입!
✔️ java에서 적을 경우
String id = req.getParameter("inputId"); String pw = req.getParameter("inputPw");
✔️ jsp에서 적을 경우
<body>
구문 안에 JSP주석 <% %> 을 달고 안에 작성 request
라고 풀어서 써주기String id = request.getParameter("inputId"); String name = request.getParameter("inputName"); String email = request.getParameter("inputEmail"); String[] pw = request.getParameterValues("inputPw"); String[] hobby = request.getParameterValues("hobby");
9. 조건식 적기
String result = null; if(id.equals("user01") && pw.equals("pass01!")) { result = "로그인 성공"; } else { result = "아이디 또는 비밀번호 불일치"; }
10. JSP 요청 위임 객체 생성 (jsp 경로 지정)
RequestDispatcher 변수명 = req.getRequestDispatcher("JSP 경로")
RequestDispatcher dispathcer = req.getRequestDispatcher("/WEB-INF/views/loginResult.jsp");
💻 RequestDispatcher
Servlet →
JSP로 HttpServletRequest 객체,
HttpServletResponse 객체를 발송(위임)하는 역할의 객체
→
정확히는 요청에 대한 응답화면을 만들어,
클라이언트에게 출력하는 역할을 위임하는 객체
11. JSP에게 전달될 예정인 req 객체에,
Object value(result 변수값) 담아서 같이 전달
req.setAttribute(String key, Object value)
req.setAttribute("r", result);
12. forword문 작성
dispathcer.forward(req, resp);
13. 이클립스 👉 VS CODE 이동,
WEB-INF
폴더 안에 views
라는 폴더 생성, (여기에 jsp결과값 모아둘거임)
폴더 안에 .jsp파일 만들기.
14. VS CODE 👉 이클립스 이동,
VSCODE에서 만든 .jsp파일 열어서 제일 상단에 아래 구문 적기
이거 작성 안하면 저장오류 계속 뜹니다...... 꼭꼭 적어주기!!
자바코드를 삽입할 수 있는 스트립 틀릿(scriptlet)
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
15. 구문 안에 결과페이지에 보이는(?) 출력할 코드 작성하기
<%= request.getParameter("inputId") %>
<br>
<%= request.getParameter("inputPw") %>
<br>
<%= 2 * 5 + 10 %>
String res = (String)request.getAttribute("r");
<!-- res 변수에 저장된 값("r" = result)이 출력됨 -->
<h3 style='color:green;'> <%= res %></h3>
<!-- res 변수값 style 효과 -->
<button type='button' onclick='history.back()'> 돌아가기</button>
<!-- history.back() 이전페이지로 돌아가는 효과 -->
JSP페이지에서 자바코드를 직접 기술할 수 있게 하는 기능
<%@ %>
: 지시자
알려주거나 지시하는 속성을 기입
<% %>
: 스크립틀릿(Scriptlet)
JSP에서 자바 코드를 작성할 수 있는 영역
<%= %>
: 표현식(Expression)
자바코드의 값을 HTML 형식으로 출력 (자바의 값을 화면에 보이게 함)
charset=UTF-8
현재 문서를 해석할 때 UTF-8 인코딩을 이용해서 해석 (해석 방법 안내)
pageEncoding="UTF-8"
현재 문서가 UTF-8 인코딩으로 작성되어 있음. (문서가 작성된 형식 안내)
${EL}
(Expression Language, 표현 언어)로 변경