티스토리 뷰
반응형
* session을 이해했다면 쇼핑몰 장바구니를 만들어 보자
* 쇼핑몰의 기본적인 흐름
1. 사용자가 로그인한다.
2. 원하는 만큼 상품을 선택한다.
3. 주문 버튼을 클릭하면 지금까지 선택했던 상품이 모두 나타난다.
4. 로그아웃을 하면 다시 로그인 페이지로 넘어간다.
* jsp 파일 구조
1. Login.jsp
2. setProduct.jsp
3. add.jsp
4. checkOut.jsp
* 코드
1. Login.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21 |
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<% session.invalidate(); %>
<center>
<h1>로그인</h1>
<hr>
<form action=setProduct.jsp method=post>
이름 : <input type=text name=name>
<input type=submit value=로그인>
</form>
</center>
</body>
</html> |
cs |
2. setProduct.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46 |
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
request.setCharacterEncoding("UTF-8");
String name = request.getParameter("name");
//request.getSession().setAttribute("userName", name);
session.setAttribute("login", name);
%>
<% if (name == "") {
%><script>
alert("로그인을 다시 해주세요");
history.back();
</script>
<%
} else { %>
<center>
<h1>상품 추가 리스트</h1>
<hr>
<%=request.getSession().getAttribute("login")%>님이 입장 하셨습니다!!
<hr>
<form method=post action=add.jsp>
<select name=product>
<option value="사과">사과</option>
<option value="포도">포도</option>
<option value="레몬">레몬</option>
<option value="복숭아">복숭아</option>
</select> <input value=추가 type=submit> <br>
<br>
<br> <a href="checkOut.jsp" name=add>계산</a>
</form>
<br><br>
<% }
%>
</center>
</body>
</html> |
cs |
3. add.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30 |
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
request.setCharacterEncoding("UTF-8");
ArrayList<String> arr = (ArrayList<String>) (session.getAttribute("productList"));
String productName = request.getParameter("product");
/* arrayList 안에 아무것도 없으면 arrayList 생성 */
if (session.getAttribute("productList") == null) {
arr = new ArrayList<String>();
}
arr.add(productName);
session.setAttribute("productList", arr);
%>
<script>alert("<%=productName%>가 추가되었습니다.");history.back();</script>
</body>
</html> |
cs |
4. checkOut.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39 |
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<% request.setCharacterEncoding("UTF-8"); %>
<% ArrayList<String> arrr = (ArrayList) (session.getAttribute("productList")); %>
<center>
<h1>상품 결과</h1>
<hr>
<%=session.getAttribute("login")%>님의 장바구니 목록
<hr>
<% if (arrr == null) { %>
장바구니에 넣은 상품이 없습니다.
<% } else {
for (String i : arrr) {
out.println(i); %><br>
<% }
} %>
<br><br><hr>
<table>
<tr>
<td><input type=button onClick="history.back()" value="뒤로가기"></td>
<td>
<form action=Login.jsp method=post>
<input value=로그아웃 type=submit></td>
</form>
</tr>
</table>
</center>
</body>
</html> |
cs |
* 실행 화면
1. 로그인 첫 화면
2. 로그인 이름에 아무것도 넣지 않았을 경우
3. 로그인 후 상품 리스트 화면
4. 상품 추가 된 화면
5. 상품 목록 화면
반응형
'Web > JSP' 카테고리의 다른 글
[JSP] include 액션 태그를 이용한 페이지 이동 (0) | 2018.04.16 |
---|---|
[jsp]post, get, sendRedirect를 이용한 페이지 이동 (0) | 2018.04.13 |
[JSP] 스코프(Scope), 생성주기 (1) | 2018.04.13 |
[JSP]include 와 forward 의 페이지 이동 (4) | 2018.04.13 |
[JSP] UTF-8 한글 깨짐 처리 GET, POST 방식 (0) | 2018.04.12 |
댓글
공지사항