[JSP] Ch07 file upload 파일업로드 totaltest

jychae·2022년 11월 3일

core choose core foreach core otherwise core set core when 데이터 vo에 담기

JSP

목록 보기

4/9

total_signin.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 
	문제1) 전송 경로 : ./total_signin_process.jsp 를 설정하세요.
		그리고 로그인, 회원가입 기능을 진행해주세요.
		
	문제2) 로그인 처리 후 해당 페이지로 error=1의 값이 넘어왔을때
		메세지를 출력하는 p태그를 활성화 하고 p태그 메세지가 보여지도록 해주세요(인증 불일치시)
 -->
<%
	String error = request.getParameter("error");
%> 
 
<c:set value="<%=error %>" var="err"/> 
<form action="./total_signin_process.jsp" method="post">
	<p>아이디 : <input type="text" name="mem_id"/></p>
	<p>비밀번호 : <input type="text" name="mem_pw"/></p>
	
	<c:if test="${err == '1' }">
	<p style="font-size:10px; color:red;">** 존재하지 않는 회원입니다.</p>
	</c:if>
	
	<p><input type="submit" value="로그인"/></p>
	<br/>
	<a href="./total_signup.jsp">회원가입</a>
</form>
</body>
</html>

total_signin_process.jsp

<%@page import="java.util.List"%>
<%@page import="dto.MemberVO"%>
<%@page import="java.util.ArrayList"%>
<%@page import="dao.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 
	문제1)
	dao패키지 내, MemberDao안에 있는 List<MemberVO>타입의 memberList 변수를 이용하여 
	내가 로그인 하기 위해서 넘긴 아이디, 비밀번호와 일치하면 total_memberList.jsp로 이동하고
	해당 total_memberList.jsp에서 알림창(alert)으로 "아이디님! 환영합니다."를 출력하세요.
	total_memberList.jsp로 이동 시, 쿼리스트링에 id='아이디'를 담아서 보내세요.
	
	문제2)
	일치하지 않는 경우, total_signin.jsp로 이동하고
	로그인 페이지 메세지 출력란에 "존재하지 않는 회원입니다." 메세지를 출력하세요.
	total_signin.jsp로 이동 시, 쿼리스트링에 error=1을 담아서 보내세요
 -->
<%
	request.setCharacterEncoding("UTF-8");

	String id = request.getParameter("mem_id");
	String pw = request.getParameter("mem_pw");

	MemberDAO memberDao = MemberDAO.getInstance();
	List<MemberVO> memberList = memberDao.getMemberList();
	

	String goPage = "";
	if(memberList.size() > 0){
		for(MemberVO memberVO : memberList){
			if(id.equals(memberVO.getMem_id()) && pw.equals(memberVO.getMem_pw())){
				goPage = "./total_memberList.jsp?id=" + id;
				break;
			}else{
				goPage = "./total_signin.jsp?error=1";
			}
		}
	}else{
		goPage = "./total.signin.jsp?error=1";
	}
	response.sendRedirect(goPage);
	   
%>
 
 
</body>
</html>

src-dto MemberVO.java

package dto;

public class MemberVO{
	private String mem_id;
	private String mem_pw;
	private String mem_name;
	private String mem_sex;
	private String filename;
	
	public String getMem_id() {
		return mem_id;
	}
	public void setMem_id(String mem_id) {
		this.mem_id = mem_id;
	}
	public String getMem_pw() {
		return mem_pw;
	}
	public void setMem_pw(String mem_pw) {
		this.mem_pw = mem_pw;
	}
	public String getMem_name() {
		return mem_name;
	}
	public void setMem_name(String mem_name) {
		this.mem_name = mem_name;
	}
	public String getMem_sex() {
		return mem_sex;
	}
	public void setMem_sex(String mem_sex) {
		this.mem_sex = mem_sex;
	}
	public String getFilename() {
		return filename;
	}
	public void setFilename(String filename) {
		this.filename = filename;
	}

}

src-dao-MemberDAO.java

package dao;

import java.util.ArrayList;

import dto.MemberVO;

public class MemberDAO{
	
	private ArrayList<MemberVO> memberList = new ArrayList<MemberVO>();
	private static MemberDAO instance = new MemberDAO();
	public static MemberDAO getInstance() {
		return instance;
	}
	
	public ArrayList<MemberVO> getMemberList() {
		return memberList;
	}

	public void insertMember(MemberVO member) {
		memberList.add(member);
	}

}

total_signup.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 
	문제2) 
	전송경로 : ./total_signup_process.jsp 를 설정해주세요.
	
	그리고 회원가입을 진행해주세요.
 -->

<h3>회원가입</h3>
<form name="fileForm" action="./total_signup_process.jsp" method="post" enctype="multipart/form-data">
	<p>아이디 : <input type="text" name="mem_id"/></p>
	<p>비밀번호 : <input type="text" name="mem_pw"/></p>
	<p>이름 : <input type="text" name="mem_name"/></p>
	<p>
		성별 : <input type="radio" name="mem_sex" value="남자"/> 남자 <input type="radio" name="mem_sex" value="여자"/> 여자
	</p>
	<p>프로필 이미지</p>
	<p><input type="file" name="filename" multiple="multiple"/></p>
	<p><input type="submit" value="가입하기"/></p>
</form>
</body>
</html>

total_signup_process.jsp

<%@page import="java.awt.ItemSelectable"%>
<%@page import="dao.MemberDAO"%>
<%@page import="dto.MemberVO"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.HashMap"%>
<%@page import="org.apache.commons.fileupload.FileItem"%>
<%@page import="java.util.Iterator"%>
<%@page import="java.util.List"%>
<%@page import="org.apache.commons.fileupload.DiskFileUpload"%>
<%@page import="java.io.File"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>            
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 
	
	문제3-1)
	src아래 dto패키지안에 있는 MemberVO 클래스를 완성하세요.
	
	[셍성할 필드들]
	String mem_id
	String mem_pw
	String mem_name
	String mem_sex
	String filename
	
	[getter/setter 생성]
	
	문제3-2) 
	total_signup.jsp에서 전달받은 모든 데이터들을 꺼내서 MemberVO 클래스에 담아주세요
	
	문제3-3)
	MemberDao 클래스에 insertMemberMember() 함수로 회원을 등록해주세요.
	
	문제3-4)
	회원 가입 완료 후, 로그인 페이지로 이동해주세요.(이동 후 로그인을 진행해주세요.)
 -->
<%
	// 진짜 파일이 담기는 경로를 설정
	String path = request.getServletContext().getRealPath("/resources/images");
	
	// 파일 담을 객체 생성
	File tempFile = new File(path);
	
	// 만약 tempFile이 없으면 그거 파일 폴더 만들어라
	if(!tempFile.exists()){
		tempFile.mkdirs();
	}

	// 파일 업로드를 위해 패키지에 포함되어 있는 DiskFileUpload 객체를 생성함
	DiskFileUpload upload = new DiskFileUpload();

	// 업로드할 파일의
	upload.setSizeMax(3000000); 	// 파일의 최대 크기설정
	upload.setSizeThreshold(1024); 	// 메모리상에 저장할 최대 크기 (byte) - 버퍼 영역
	upload.setRepositoryPath(path); // 업로드된 파일을 임시로 저장할 경로() 위에서 파일담기는 경로를 path로 지정함
	
	// 생성된 객체를 통해 DiskFileUpload 클래스가 제공하는 메소드를 사용하여 웹 브라우저가 전송한
	// multipart-form 유형의 요청 파라미터를 가져옴
	// 폼 페이지 에서 전송된 요청 파라미터를 전달받도록 DiskFileUpload 객체 타입의 parseRequest() 메소드를 작성
	List items = upload.parseRequest(request); 	// 요청했던 파일을 받아서 List에 담아둠! items라는 이름으로

	// 폼 페이지에서 전송된 요청 파라미터를 Iterator 클래스로 변환
	// Iterator는 자바의 컬렉션 프레임워크에서 컬렉션에 저장되어 있는 요소들을 읽어오는 방법을 표준화한 것
	Iterator params = items.iterator(); // List에 담긴 애들 하나씩 읽어서 오려고 필요해!
		
	// 출력을 위한 Map 공간 
	Map<String, Object> dataMap = new HashMap<String,Object>(); // 담아서 넘겨줄 객체가 필요하니까
	
	// 파일 업로드 max 사이즈 설정
	int maxSize = 4 * 1024 * 1024; // 4MB
	
	while(params.hasNext()){ //hasNext() : 읽어올 요소가 남아있는지 확인하는 메서드, 요소가 있으면 true - 없으면 false
		FileItem item = (FileItem) params.next(); // next() : 다음 데이터를 반환 - 아마 FileItem의 item을 가져오는 듯함
		
		// isFormField()폼필드인지 아닌지 여부 반환 / 폼필드이면 true 반환
		if(item.isFormField()){ // 폼 페이지에서 전송된 요청 파라미터가 일반 데이터이면..
			String name = item.getFieldName(); 		// 파라미터의 이름 / getFiledName() : 필드 이름을 반환/input 태그의 name 속성의 값을 반환
			String value = item.getString("UTF-8"); // 파라미터의 값
			// 위에서 출력을 위해 만든 Map에 폼에서 받아온 일반데이터를 저장한다 (파일 이외의 것)
			dataMap.put(name,value);
		} else{					// 폼 페이지에서 전송된 요청 파라미터가 파일이면..
			 String fileFieldName = item.getFieldName();	// 요청 파라미터의 이름
			 String fileName = item.getName();			// 저장 파일의 이름 / getName() : 클라이언트에 저장되어 있던 파일의 이름을 반환/ 반환된 이름은 경로와 파일명이 모두 있는 파일명
			
			 if(!fileName.equals("")){ 	// 만약에 저장 파일의 이름이 ""와 같지 않다면! / 파일이 실제로 올라왔다는 의미
			 	 String contentType = item.getContentType();	// 파일 콘텐츠 유형 / getContentType() : 콘텐츠 타입을 반환
				 fileName = fileName.substring(fileName.lastIndexOf("\\") + 1); // 진짜 파일 이름을 알아내기 위해! 파일 경로를 잘라내는!
				 long fileSize = item.getSize();	// 파일 크기 정보
				 File file = new File(path + "/" + fileName);
				
				 item.write(file);
				 dataMap.put(fileFieldName, fileName); //key, value
			 }
		 }
	}
	
	// MemberDAO 에서 만든 인스턴스 객체 싱글톤 호출함
	MemberDAO memberDao = MemberDAO.getInstance();
	
	// 출력용 Map에 담은 dataMap 담아줘야지 객체 만들어서~ 통채로 보내줄꺼야
	MemberVO memberVO = new MemberVO();
	
	// memberVO의 	setMem_id 할껀데 dataMap 안에 get가져와 "mem_id" 키값을 근데 그 거 object니까 toString() 
	memberVO.setMem_id(dataMap.get("mem_id").toString()); 
	memberVO.setMem_pw(dataMap.get("mem_pw").toString());
	memberVO.setMem_name(dataMap.get("mem_name").toString());
	memberVO.setMem_sex(dataMap.get("mem_sex").toString());
	memberVO.setFilename(dataMap.get("filename").toString());
	
	// 위에서 담은 memberVO 파라미터값 가지고 넘어가라 insertMember() 실행 고고
	memberDao.insertMember(memberVO);
	
	// 회원가입하고 다시 원래화면으로 돌아가세요..? 뭐 할게없음... 내일 아님... 넘어가세요?/ 페이지간의 파라미터 넘기거나 공유하는게 없으니까?
	// sendRedirect 는 단순 이동시 주로 사용되는 방식이며, sendRedirect 는 반드시 doGet메소드로 이동
	// forward 데이터를 가지고 이동하기 위해 사용되는 방식,  Forward 방식은 client의 요청대로 메소드를 수행
	response.sendRedirect("./total_signin.jsp");
%>

</body>
</html>

total_memberList.jsp

<%@page import="dto.MemberVO"%>
<%@page import="java.util.ArrayList"%>
<%@page import="dao.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>    
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 
	문제1)
	회원가입을 통해 가입한 회원들의 목록(getMemberList) 전부를 가져와서 
	아래 테이블을 채워주세요.
	
	전체 목록 출력을 core태그를 이용하여 작성해주세요.
	회원목록이 없는 경우 "조회하실 회원정보가 존재하지 않습니다."를 출력해주세요
	회원목록이 있는 경우 아래를 이용해서 출력해주세요.
	
	데이터 저장 : core set
	전체목록 출력 : core choose, core when, core otherwise
				core foreach
	
	문제2)			
	해당 페이지로 넘겨받은 쿼리스트링 중, id가 있다면
	'아이디'님 환영합니다! 알림창을 띄워주세요
 -->
<%
	// id값을 가지고 갔겠지
	String id = request.getParameter("id");
	MemberDAO memberDao = MemberDAO.getInstance();
	ArrayList<MemberVO> memberList = memberDao.getMemberList();
	
	if(id != null){
		%>
		<c:set value="<%=id %>" var="mem_id"/>	
		<%
	}
%>
 
<c:set value="<%=memberList %>" var="list"/> 
<h3>회원목록</h3>
<hr/>
<br/>
<a href="./total_signup.jsp">회원등록</a>
<br/><br/>
<table border="1">
	<tr>
		<th>이미지</th>
		<th>회원정보</th>
		<th>버튼</th>
	</tr>
	<c:choose>
	
		<c:when test="${empty list }">
			<tr>
				<td colspan="3">조회하실 회원정보가 존재하지 않습니다.</td>
			</tr>
		</c:when>
		
		<c:otherwise>
		 <!--c:forEach items="${리스트가 받아올 배열이름 }" var="for문 내부 사용할 변수" varStatus="상태용 변수" -->
			<c:forEach items="${list }" var="member" varStatus="stat">
				<tr>
					<td width="120px">
						<img src="/JSPBook/resources/images/${member.filename }" style="width:116px;" alt="아이디님의 사진"/>
					</td>
					<td>
						<p>아 이 디 : ${member.mem_id }</p>
						<p>비밀번호 : ${member.mem_pw }</p>
						<p>이    름 : ${member.mem_name }</p>
						<p>성    별 : ${member.mem_sex }</p>
					</td>
					<td>
						<a href="">상세정보</a>
					</td>
				</tr>
			</c:forEach>
		
		</c:otherwise>
		
	</c:choose>
	
</table>

<script type="text/javascript">
var idd = "${mem_id}";
console.log(idd);

if(idd != null || idd != ""){
	alert(idd + "님! 환영합니다!");	
}
</script>

</body>
</html>

jychae

안녕하세요! 초보개발자 공부 시작!

이전 포스트

[JSP] Ch07 file upload 파일업로드 TEST

다음 포스트

[JSP] Ch07 file upload 파일업로드 totaltest

JSP

total_signin.jsp

total_signin_process.jsp

src-dto MemberVO.java

src-dao-MemberDAO.java

total_signup.jsp

total_signup_process.jsp

total_memberList.jsp

[JSP] Ch07 file upload 파일업로드 TEST

[JSP] Ch08 유효성 검사 / 데이터 유무, 길이, 숫자 여부, 정규표현식

0개의 댓글