index 페이지에서 로그인, 로그아웃 처리 21. 03. 17.

js랑 jsp<% %> 차이.

jsp가 해석해서 html로 만들어 줌
자바스크립트는 브라우저가 해석하는 거
처리하는 문구랑 시점이 다름.

HTML 주석은 결과 페이지에 대한 주석이라 소스보기 하면 다 나옴.
<%@ ... %> : JSP 지시어의 형식.
- 종류 : page 지시어, include 지시어, taglib 지시어

page 지시어

- import 속성

쉼표를 이용해 여러 개의 패키지 또는 클래스를 한 번에 import하여 사용할 수 있음.
<%@page import="java.util.Date, java.text.SimpleDateFormat" %>

- buffer 속성

기본 값 8kb
<%@ page buffer="16kb" %>

- autoflush 속성

기본 값 true. 버퍼가 다 채워지면 클라이언트에 전송하고 버퍼를 비움.

- contentType 속성

MIME(Multipurpose Internet Mail Extension) : 다목적 인터넷 메일 확장자
<%@ page contentType="text/html" %>

include 지시어

: 특정한 JSP 파일을 해당 JSP에 삽입할 수 있도록 하는 기능. 레이아웃 탬플릿 페이지를 작성할 때 많이 쓰임.

형식 : <%@ include file="header.jsp" %>

-- importTest.jsp

<%@page import="java.util.Date"%>
<%@page import="java.text.SimpleDateFormat"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>2021. 3. 17. 오전 10:19:22</title>
</head>
<body>
	<h1>지금 시간은
		<%=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(new Date()) %>
	
	입니다</h1>
<%@ include file="index.jsp" %>	
</body>
</html>

taglib 지시어

: JSTL이나 커스텀 태그 등 태그 라이브러리를 JSP에서 사용할 때 접두사를 지정하기 위해 사용.

- uri 속성

- prefix 속성

사용할 커스텀 태그의 네임 스페이스를 지정.
RSS할 때 봤음. <my:a>에서 : 앞 my가 네임스페이스.

JSP 스크립트 요소

선언문, 스크립틀릿, 표현식

-- script.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>2021. 3. 17. 오전 10:41:39</title>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
	<%-- 선언문(전역위치 > 메서드선언도 가능) --%>	
	<%!
		int a = 10; // 인스턴스 변수 static붙이면 클래스 변수
	%>
	<%! 
		String print() {
		return "안녕";
	}
	%>
	<%-- 스크립틀릿(지역위치) --%>	
	<%
		int a = 20; // 지역 변수
	%>
	<%-- 표현식(아무것도 안 쓰면 에러남. --%>	
	<%=10
	%>
	<%=a %>
	<%=print() %>
</body>
</html>

- 표현식 아무것도 안 쓰면 에러 나는 건 <%= %> 이 print() 기 때문에.

05. 내장 객체와 액션 태그

내장 객체

request
response
session
pageContext
out
application
config
page (잘 안 씀)
exception

-- ForwardTest.java

package chapter05;

import java.io.IOException;
import java.io.Writer;

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("/forward")
public class ForwardTest extends HttpServlet {

	@Override
	protected void service(HttpServletRequest arg0, HttpServletResponse arg1) throws ServletException, IOException {
		System.out.println("Servlet ::" + arg0.getParameter("no"));
		Writer w = arg1.getWriter();
		arg0.getRequestDispatcher("scope.jsp").forward(arg0, arg1);
	}
}

-- scope.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>2021. 3. 17. 오전 11:18:40</title>
</head>
<body>
	<%
	out.println("scope.jsp ::" + request.getParameter("no"));
		// 내장객체 9가지
		
		// 영역객체 (4)
		// page > request > session > application
		// page 범위- private 범위와 일치 (scope.jsp)
		// application 범위- public 범위와 일치 (chapter05) 서버가 살아있는 동안
		
		// session의 범위- session이 유지되는 동안 (로그아웃,)
		
		// request의 범위- 요청하는 동안. 페이지보다 큼.
		// include, forward
	%>
	<%@ include file="target.jsp" %>	
</body>
</html>

-- target.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>2021. 3. 17. 오전 11:29:02</title>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
<%
	out.println("target ::" + request.getParameter("no"));
%>	
</body>
</html>

- ForwardTest.java를 실행하면 처음 값은 null, 쿼리스트링으로 no=값을 입력하면 scope와 target.jsp 모두 적용됨.

- out

내장 객체 out의 타입은 JspWriter. -> 출력 관련 스트림은 바이트 단위고 JspWriter는 문자 단위.

- request

요청 파라미터와 관련된 메소드

리턴 타입	메소드명	설명
String	getParameter(String name)	name이란 이름으로 지정된 파라미터에 할당된 값을 리턴. 지정된 이름의 파라미터가 없으면 null을 리턴.
String[]	getParameterValues(String name)	name이란 이름으로 지정된 파라미터의 모든 값을 String 배열로 리턴. 하나의 이름으로 여러 개의 값을 가질 수 있는 checkbox와 같은 태그를 사용했을 때에 주로 사용됨.
Enumeration	getParameterNames()	요청에 포함된 모든 파라미터 이름을 java.util.Enumeration 객체로 리턴.

-- headers.jsp

<%@page import="java.util.ArrayList"%>
<%@page import="java.util.Iterator"%>
<%@page import="java.util.Collection"%>
<%@page import="java.util.Enumeration"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>2021. 3. 17. 오후 12:07:23</title>
</head>
<body>
	<h1>헤더 정보 예제</h1>
	<%
		Enumeration<String> enumeration = request.getHeaderNames();
		while(enumeration.hasMoreElements()) {
			String name = enumeration.nextElement();
			String value = request.getHeader(name);
			out.println(name + "::" + value + "<br>");
		}
	%>
	<hr>
	<%
		Iterator <String> iterator = new ArrayList<>(response.getHeaderNames()).iterator();
		while(iterator.hasNext()) {
			String name = iterator.next();
			String value = response.getHeader(name);
			out.println(name + "::" + value + "<br>");
		}
	%>
</body>
</html>

-- action1.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>2021. 3. 17. 오후 12:34:32</title>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
	<h1>action1</h1>
	<%
//		request.getRequestDispatcher("action2.jsp").forward(request, response);
	%>
	<%-- <jsp:forward page="action2.jsp"></jsp:forward> <!-- jsp = 네임스페이스 -->
    
	<jsp:forward page="action2.jsp"/> --%>
	<jsp:include page="action2.jsp"/>
</body>
</html>

-- action2.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>2021. 3. 17. 오후 12:34:41</title>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
	<h1>action2</h1>
</body>
</html>

- <jsp 로 열었으면 /로 닫아야 함.

화면 분할

WebContent - template 생성. header.jsp, footer.jsp 들어감.
Webcontent에 index.jsp 생성
WebContent - assats - css 생성. common.css 들어감.
Web-INF에 web.xml 넣어줌.

-- header.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>2021. 3. 17. 오후 12:44:09</title>
	<link rel="stylesheet" href="assets/css/common.css">
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
	<%
		String idsave = null;
		for(Cookie cookie : request.getCookies()) {
			if(cookie.getName().equals("idsave")) {
				idsave = cookie.getValue();
			}

		}
	%>
	<div class="wrapper">
	<header class="header">
		<h1>사이트 이름 : 제목</h1>
		<form method="post" action="login">
		<ul>
		<c:if test="${empty member}">
			<li><label>아이디 <input type="text" name="id"></label></li>
			<li><label>비밀번호 <input type="password" name="pw"></label></li>
			<li><button>로그인</button></li>
			<li>
				<label>아이디 저장 <input type="checkbox" name="idsave" <%=idsave == null ? "" : "checked" %>></label>
			</li>
		</c:if>
		<c:if test="${!empty member}">
			<li>${member.name}님 환영합니다. <button formaction="logout">로그아웃</button></li>
		</c:if>
		</ul>
		</form>
		
	</header>

- css 파일 연결

- 전 시간에 했던 login.jsp 내용을 header.jsp에 옮김. <c:if test>로.

-- index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
	<jsp:include page="template/header.jsp"/>

	<div class="content">
		<table>
			<caption>공지사항</caption>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
		</table>
		<table>
			<caption>자유게시판</caption>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
		</table>
		<table>
			<caption>Q&A</caption>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
		</table>
		<table>
			<caption>자료실</caption>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
			<tr>
				<td><a href="#">게시글 제목 부분</a></td>
				<td><a href="#">03/17</a></td>
			</tr>
		</table>
	</div>
	<jsp:include page="template/footer.jsp"/>

- 위, 아래에 include 함.

-- footer.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
	<footer>
		<p>사이트 개요</p>
		<p>copyright &copy; 2021</p>
		<address>충남 천안시 동남구</address>
	</footer>
	</div>
</body>
</html>

-- common.css

@charset "UTF-8";
body {margin: 0;}
a {text-decoration: none; color: black;}
.wrapper {width: 978px; margin: 0 auto;}
.header {padding: 30px; color: #eee; background-color: #333; min-height: 50px;}
.header > * {margin: 0;}
.header h1 {float: left; width: 300px;}
.header ul {float: right;}
.header li {display: inline-block;}
.header label {font-size: 12px;}
.header label input {padding: 5px; width: 50px;}
.content {clear: both; padding: 30px 0; padding-left: 94px;}
.content table {width: 30%; display: inline-table; margin: 20px 50px; table-layout: fixed;}
.content table:nth-child(odd) {margin-right: 100px}
.content table td:first-child {width: 85%} 

footer {text-align: center; background-color: #333; color:#eee; padding: 15px;}

-- Index.java

package controller;

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;

@WebServlet("/index")
public class Index extends HttpServlet{

	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		req.getRequestDispatcher("index.jsp").forward(req, resp);
	}

}

-- Login.java

package controller;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import service.MemberService;
import service.MemberServiceImpl;
import vo.Member;

@WebServlet("/login")
public class Login extends HttpServlet{

	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		// 페이지 포워드
		req.getRequestDispatcher("login.jsp").forward(req, resp);
	}

	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		// 아이디, 패스워드 값 확인 (파라미터로 넘어옴)
		req.setCharacterEncoding("utf-8"); // HTTP 세상은 1바이트라. 한글처리
		
		Member member = new Member();
		member.setUserid(req.getParameter("id"));
		member.setPassword(req.getParameter("pw"));
		
//		System.out.println(member);
		MemberService service = new MemberServiceImpl();
		
		// 분기
		Member result = service.login(member);
		System.out.println(result);
		if(result != null) {
			// 로그인 성공시
			HttpSession session = req.getSession(); // 세션생성
			session.setAttribute("member", result);
			
			String idsave = req.getParameter("idsave");
			System.out.println(idsave);
			if(idsave != null) {
				// 쿠키사용
				Cookie cookie = new Cookie("idsave", member.getUserid());
				// 시간 안 정하면 세션이랑 시간이 똑같음.
				cookie.setMaxAge(60 * 60 * 24 * 365);
				resp.addCookie(cookie);
			}
			else {
				for(Cookie cookie : req.getCookies()) {
					if(cookie.getName().equals("idsave")) {
						cookie.setMaxAge(0);
						resp.addCookie(cookie);
					}
				}
			}
		}
		resp.sendRedirect("index");
	}
	
}

- 리다이렉트 index로 해줌.

-- web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
  <display-name>chapter03</display-name>
  <welcome-file-list>
    <welcome-file>index</welcome-file>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
</web-app>

저작자표시 (새창열림)

'JSP & Servlet' 카테고리의 다른 글

회원제 게시판(03), 파일첨부 21. 03. 22. (0)	2021.03.22
회원제 게시판(02), JSTL과 EL 21. 03. 19. (0)	2021.03.19
자바빈, 예외처리, 파일 업로드, 회원제 게시판 만들기(01) 21. 03. 18. (0)	2021.03.18
회원가입, 로그인, 로그아웃 21. 03. 16. (0)	2021.03.16
01장- JSP 입문, 03장- Servlet의 핵심 사항들, 05장- 내장 객체 조금 21. 03. 15. (0)	2021.03.15

삐약삐약

index 페이지에서 로그인, 로그아웃 처리 21. 03. 17.

JSP 스크립트 요소

05. 내장 객체와 액션 태그

내장 객체

화면 분할

'JSP & Servlet' 카테고리의 다른 글

티스토리툴바

index 페이지에서 로그인, 로그아웃 처리 21. 03. 17.

JSP 스크립트 요소

05. 내장 객체와 액션 태그

내장 객체

화면 분할

'JSP &amp; Servlet' 카테고리의 다른 글

'JSP &amp; Servlet' Related Articles

티스토리툴바

'JSP & Servlet' 카테고리의 다른 글

'JSP & Servlet' Related Articles